/* =========================================================
   DEETS deep-ocean theme
   Canonical visual layer. Edit this file for current theme work.
   Base layout belongs in styles.css; shared component behavior belongs in polish.css.
   ========================================================= */

/* =========================================================
   Home and bottom navigation
   ========================================================= */

:root{
  --ocean-bg:#071521;
  --ocean-surface:#0d2133;
  --ocean-surface-2:#12304a;
  --ocean-line:#23445e;
  --ocean-text:#f2f7fa;
  --ocean-muted:#a7bece;
  --ocean-yellow:#ffd84d;
  --ocean-blue:#57b9ff;
  --ocean-food:#ff9a4d;
}

/* Home-specific surface treatment. Shared ocean surfaces follow below. */
body:has(#home.active){
  background:
    radial-gradient(circle at 50% -12%,rgba(87,185,255,.12),transparent 34rem),
    var(--ocean-bg);
  color:var(--ocean-text);
}

body:has(#home.active) .topbar{
  background:rgba(7,21,33,.94);
  border-bottom:none;
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  position:sticky;
  top:0;
  z-index:30;
}

body:has(#home.active) .topbar::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-5px;
  height:5px;
  background:linear-gradient(180deg,rgba(7,21,33,.94) 0%,rgba(7,21,33,0) 100%);
  pointer-events:none;
}

body:has(#home.active) .chip,
body:has(#home.active) .settings-btn,
body:has(#home.active) .filter-btn{
  background:var(--ocean-surface);
  border-color:var(--ocean-line);
  color:var(--ocean-text);
  box-shadow:none;
}

body:has(#home.active) .search{
  background:var(--ocean-surface);
  border-color:var(--ocean-line);
  color:var(--ocean-text);
  caret-color:var(--ocean-blue);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}

body:has(#home.active) .search::placeholder{
  color:#7895aa;
}

#home.active{
  color:var(--ocean-text);
}

#home .eyebrow,
#home .filter-title,
#home .meta,
#home .restaurant-card-address{
  color:var(--ocean-muted);
}

#home .location-row h1{
  color:var(--ocean-text);
}

#home .social-card{
  background:
    radial-gradient(circle at 82% -15%,rgba(87,185,255,.22),transparent 44%),
    linear-gradient(155deg,var(--ocean-surface-2),var(--ocean-surface) 54%,#081825);
  border:1px solid rgba(87,185,255,.16);
  color:var(--ocean-text);
  box-shadow:0 12px 28px rgba(1,8,14,.18);
}

#home .social-card p{
  color:var(--ocean-muted);
}

#home .social-pill{
  background:rgba(167,190,206,.10);
  color:var(--ocean-text);
  border:1px solid rgba(167,190,206,.10);
}

#home .social-pill.active{
  background:var(--ocean-yellow);
  border-color:var(--ocean-yellow);
  color:#101820;
  box-shadow:none;
}

#home .home-borough-quick{
  color:var(--ocean-text);
}

#home .filters{
  background:var(--ocean-surface);
  border-color:var(--ocean-line);
  color:var(--ocean-text);
  box-shadow:none;
}

/* Keep Home search empty states inside the Deep Ocean palette. */
#home .restaurant-results-empty{
  background:var(--ocean-surface);
  border-color:var(--ocean-line);
  color:var(--ocean-text);
}

#home .restaurant-results-empty b{
  color:var(--ocean-text);
}

#home .restaurant-results-empty span{
  color:var(--ocean-muted);
}

#home .restaurant-results-empty button{
  background:var(--ocean-surface-2);
  border-color:var(--ocean-line);
  color:var(--ocean-text);
}

#home .restaurant-search-add.compact button{
  background:none;
  border:0;
  color:var(--ocean-muted);
}

#home .restaurant-search-add.compact button:hover,
#home .restaurant-search-add.compact button:active{
  color:var(--ocean-text);
}

#home .restaurant-search-add.prominent button{
  background:var(--ocean-surface);
  border-color:var(--ocean-line);
  color:var(--ocean-text);
}

#home .restaurant-search-add.prominent button:hover,
#home .restaurant-search-add.prominent button:active{
  background:var(--ocean-surface-2);
  border-color:var(--ocean-blue);
  color:#fff;
}

#home .filter-chips button,
#home .clear-filter,
#home .active-restaurant-filters button{
  background:#0a1b2a;
  border-color:var(--ocean-line);
  color:var(--ocean-muted);
}

#home .filter-chips button.active,
#home .active-restaurant-filters button.active{
  background:var(--ocean-yellow);
  border-color:var(--ocean-yellow);
  color:#101820;
  box-shadow:none;
}

#home .restaurant-card{
  background:
    linear-gradient(180deg,rgba(18,48,74,.94),rgba(13,33,51,.98));
  border-color:rgba(87,185,255,.28);
  color:var(--ocean-text);
  box-shadow:0 2px 0 rgba(255,255,255,.015);
}

#home .restaurant-card:hover{
  border-color:rgba(87,185,255,.28);
}

#home .restaurant-open{
  color:var(--ocean-text);
}

#home .restaurant-card-meta>span+span::before{
  color:#66859b;
}

#home .restaurant-card-meta .restaurant-price{
  color:#87cfff;
}

#home .restaurant-card .scorebox{
  background:rgba(244,122,31,.13);
  color:#ffb06f;
  border-color:rgba(255,154,77,.28);
}

#home .restaurant-card .card-foot{
  border-top-color:rgba(167,190,206,.18);
  color:#8fa9ba;
}

#home .restaurant-card .card-foot-right{
  display:inline-flex;
  align-items:center;
  gap:8px;
  flex:0 0 auto;
}

#home .restaurant-card-want{
  border-color:rgba(87,185,255,.24);
  background:rgba(13,33,51,.72);
  color:var(--ocean-muted);
}

#home .restaurant-card-want:hover{
  border-color:rgba(87,185,255,.45);
  background:rgba(87,185,255,.14);
  color:var(--ocean-text);
}

#home .restaurant-card-want.active{
  border-color:rgba(255,154,77,.55);
  background:rgba(255,154,77,.18);
  color:#ffb06f;
}

#home .restaurant-card-want:active{
  transform:scale(.94);
}

#home .restaurant-orders>span{
  color:#ffb06f;
}

#home .restaurant-card-address:hover{
  color:var(--ocean-text);
}

/* Dark navigation anchors the new palette without changing its geometry. */
.nav{
  background:rgba(7,21,33,.94)!important;
  border-color:rgba(87,185,255,.16)!important;
  box-shadow:0 10px 30px rgba(1,8,14,.30)!important;
  isolation:isolate;
}

.nav button{
  color:#819aac;
}

.nav button.active{
  color:var(--ocean-text);
}

.nav button img{
  filter:brightness(0) invert(1);
  opacity:.62;
}

.nav button.active img{
  filter:none;
  opacity:1;
}

.nav-orb{
  background:linear-gradient(135deg,#ffe98a,var(--ocean-yellow));
  -webkit-transform:translate3d(calc(var(--nav-index,0) * 58px),0,0);
  transform:translate3d(calc(var(--nav-index,0) * 58px),0,0);
  -webkit-transition:-webkit-transform 320ms cubic-bezier(.22,.68,0,1);
  transition:transform 320ms cubic-bezier(.22,.68,0,1);
  will-change:transform;
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
}

/* Preserve an immediate state change for users who request less motion. */
@media(prefers-reduced-motion:reduce){
  .nav-orb{
    -webkit-transition:none!important;
    transition:none!important;
  }
}

@media(hover:hover){
  body:has(#home.active) .chip:hover,
  body:has(#home.active) .settings-btn:hover,
  body:has(#home.active) .filter-btn:hover,
  #home .clear-filter:hover{
    background:#112a3f;
    border-color:#315975;
  }
}

/* =========================================================
   DEETS AC5 ocean legibility + signed-out You — 2026-09-21
   Increase only the smallest dark-theme text by ~1px.
   Replace only the signed-out You composition.
   ========================================================= */

/* Dark-theme microcopy was visually too small against navy surfaces. */
#home .eyebrow,
#home .filter-title{font-size:10px}

#home .restaurant-card-meta,
#home .restaurant-card-address,
#home .social-pill{font-size:11px}

#home .restaurant-orders,
#home .restaurant-card .card-foot{font-size:10px}

#home .restaurant-card .scorebox span{font-size:8px}

.nav button{font-size:10px}

/* Signed-out You: sparse ocean entry screen rather than a feature explainer. */
#you:has(.profile-ocean-auth){
  min-height:calc(100svh - 132px);
  margin:-15px 0;
  padding:0;
  overflow:hidden;
  background:
    radial-gradient(circle at 76% 2%,rgba(87,185,255,.13),transparent 31rem),
    linear-gradient(180deg,#0b2234 0%,#071521 52%,#040c13 100%);
}

.profile-ocean-auth{
  position:relative;
  min-height:calc(100svh - 132px);
  overflow:hidden;
  isolation:isolate;
  color:var(--ocean-text);
}

.profile-ocean-auth::before{
  content:"";
  position:absolute;
  inset:-10% -30% auto;
  height:48%;
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(ellipse at 50% 0%,rgba(104,198,255,.12),transparent 66%);
  transform:rotate(-5deg);
}

.profile-ocean-question{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  font-weight:950;
  line-height:1;
  letter-spacing:-.07em;
  color:rgba(242,247,250,.92);
  text-shadow:0 8px 24px rgba(0,0,0,.20);
}

.profile-ocean-question span{
  position:absolute;
  display:block;
  font-size:clamp(96px,32vw,142px);
}

/* WHO opens wider across the top; ARE crosses center; YOU breaks apart near the bottom. */
.profile-ocean-question span:nth-child(1){top:1%;left:-7%;transform:rotate(-13deg)}
.profile-ocean-question span:nth-child(2){top:16%;left:31%;transform:rotate(8deg);opacity:.94}
.profile-ocean-question span:nth-child(3){top:2%;left:78%;transform:rotate(-6deg);opacity:.89}
.profile-ocean-question span:nth-child(4){top:28%;left:-4%;transform:rotate(7deg);opacity:.83}
.profile-ocean-question span:nth-child(5){top:39%;left:35%;transform:rotate(-8deg);opacity:.78}
.profile-ocean-question span:nth-child(6){top:32%;left:75%;transform:rotate(6deg);opacity:.72}
.profile-ocean-question span:nth-child(7){top:47%;left:7%;transform:rotate(-12deg);opacity:.58}
.profile-ocean-question span:nth-child(8){top:74%;left:-9%;transform:rotate(8deg);opacity:.47}
.profile-ocean-question span:nth-child(9){top:72%;left:70%;transform:rotate(28deg);opacity:.38}

.profile-ocean-entry{
  position:absolute;
  left:0;
  right:0;
  top:61%;
  z-index:2;
  display:grid;
  justify-items:center;
  padding:0 22px max(24px,env(safe-area-inset-bottom));
  transform:translateY(-2%);
}

.profile-ocean-signin{
  position:relative;
  z-index:2;
  width:100%;
  max-width:420px;
  justify-self:center;
  min-height:142px;
  border:0;
  border-radius:18px;
  background:var(--food);
  color:#111820;
  font-size:60px;
  font-weight:950;
  line-height:1;
  letter-spacing:-.045em;
  cursor:pointer;
  transform:rotate(-1.2deg);
  box-shadow:0 9px 0 #8b3b08,0 18px 36px rgba(0,0,0,.24);
}

.profile-ocean-signin:active{
  transform:rotate(-1.2deg) translateY(3px) scale(.99);
  box-shadow:0 6px 0 #8b3b08,0 13px 26px rgba(0,0,0,.22);
}

.profile-ocean-links{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:7px 16px;
  width:min(94vw,390px);
  margin-top:22px;
}

.profile-ocean-links button{
  min-height:32px;
  padding:3px 0;
  border:0;
  background:none;
  color:#88a5b8;
  font-size:12px;
  font-weight:760;
  text-decoration:underline;
  text-decoration-color:rgba(136,165,184,.42);
  text-underline-offset:3px;
}

.profile-ocean-links button:hover,
.profile-ocean-links button:focus-visible{
  color:var(--ocean-text);
}

.profile-ocean-eater{
  position:absolute;
  left:0;
  right:0;
  bottom:7%;
  z-index:1;
  margin:0;
  text-align:center;
  color:#c6d6e0;
  font-size:16px;
  font-weight:950;
  letter-spacing:.21em;
}

@media(max-width:350px){
  .profile-ocean-signin{
    width:100%;
    max-width:340px;
    min-height:128px;
    font-size:52px;
  }
  .profile-ocean-question span{
    font-size:92px;
  }
  .profile-ocean-links button{font-size:11px}
  .profile-ocean-eater{font-size:14px;bottom:6%}
}

@media(prefers-reduced-motion:reduce){
  .profile-ocean-question span,
  .profile-ocean-signin{
    transition:none!important;
  }
}

/* =========================================================
   DEETS AC5 deep-ocean system propagation — 2026-09-21
   Palette/surface pass only. Existing layouts and data behavior remain intact.
   ========================================================= */

:root{
  --bg:#071521;
  --card:#0d2133;
  --text:#f2f7fa;
  --muted:#a7bece;
  --line:#23445e;
  --pill:#102a3f;
  --food:#f47a1f;
  --food-soft:#352315;
  --price:#78c8ff;
  --price-soft:#102b40;
  --green:#55c995;
  --red:#ff7373;
  --purple:#a78bfa;
  --purple-soft:#251f3a;
  --focus-ring:rgba(87,185,255,.38);
  --shadow-soft:0 1px 0 rgba(255,255,255,.02),0 10px 24px rgba(1,8,14,.16);
  --shadow-lift:0 2px 0 rgba(255,255,255,.025),0 14px 30px rgba(1,8,14,.24);
}

body,
.app{
  background:var(--ocean-bg);
  color:var(--ocean-text);
}

.topbar{
  background:rgba(7,21,33,.94);
  border-bottom-color:rgba(87,185,255,.14);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
}

.eyebrow{color:#8eabc0;font-size:10px}
.meta{color:var(--ocean-muted)}
.back{color:#8fa9ba}
.back:hover{color:var(--ocean-text)}

.chip,
.settings-btn,
.filter-btn{
  background:var(--ocean-surface);
  border-color:var(--ocean-line);
  color:var(--ocean-text);
}

.search,
.mini-search,
.discussion-input,
textarea,
.auth-form input{
  background:var(--ocean-surface);
  border-color:var(--ocean-line);
  color:var(--ocean-text);
  caret-color:var(--ocean-blue);
}

.search::placeholder,
.mini-search::placeholder,
.discussion-input::placeholder,
textarea::placeholder,
.auth-form input::placeholder{
  color:#718da1;
}

/* MAP */
#map{
  color:var(--ocean-text);
}

#map .map-key,
#map .map-focuses button{
  background:#0b1d2c;
  border-color:var(--ocean-line);
  color:var(--ocean-muted);
}

#map .map-focuses button.active{
  background:var(--ocean-yellow);
  border-color:var(--ocean-yellow);
  color:#101820;
}

#map .empty-map{
  border:1px solid rgba(87,185,255,.17);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}

#map .map-note{color:#8fa9ba}

.map-pop{
  background:rgba(7,21,33,.97)!important;
  border-color:rgba(87,185,255,.18)!important;
  padding:10px 12px!important;
  border-radius:15px!important;
  box-shadow:0 12px 28px rgba(0,0,0,.35)!important;
}

.map-pop-score,
.map-pop-dish,
.map-pop-actions button,
.map-pop-directions{
  background:rgba(167,190,206,.08)!important;
  border-color:rgba(167,190,206,.12)!important;
}

.map-pop-explore{
  background:var(--food);
  border-color:var(--food);
  color:#101820;
}

.map-pop-score-row{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:6px!important;
}

.map-pop-directions{
  margin-left:auto;
  min-height:26px!important;
  padding:4px 11px!important;
  border:1px solid rgba(167,190,206,.2)!important;
  border-radius:999px!important;
  background:rgba(167,190,206,.09)!important;
  color:var(--ocean-text)!important;
  font-size:10px!important;
  font-weight:750!important;
  cursor:pointer;
}

.map-pop-must-eats{
  display:flex;
  align-items:center;
  gap:6px;
  margin-top:6px!important;
  flex-wrap:wrap;
}

.map-pop-must-label{
  font-size:8px!important;
  font-weight:900!important;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:#ff9a4d!important;
  flex-shrink:0;
}

.map-pop-dishes{
  display:flex;
  align-items:center;
  gap:4px 0;
  flex-wrap:wrap;
  min-width:0;
}

.map-pop-dish-name{
  display:inline-block;
  padding:0;
  color:#e4eff7;
  font-size:9.5px;
  font-weight:600;
  line-height:1.3;
  overflow-wrap:anywhere;
}
.map-pop-dish-name + .map-pop-dish-name::before{content:'·';margin:0 6px;color:var(--muted)}

.moderation-preview-photo img{
  max-width:120px;
  max-height:90px;
  border-radius:8px;
  object-fit:cover;
  display:block;
  margin:6px 0;
  border:1px solid #23445e;
}

.moderation-preview-text{
  margin:6px 0;
  padding:6px 10px;
  background:rgba(10,27,42,.6);
  border-left:3px solid #ff9a4d;
  border-radius:4px;
  font-size:12px;
  color:#dce7ed;
  font-style:italic;
}

.photo-placeholder.photo-rejected{
  border:1px dashed #7a2d2d!important;
  background:rgba(40,15,15,.5)!important;
}

.photo-rejected-notice{
  color:#ff8585!important;
  font-size:11px;
  line-height:1.35;
}

.photo-placeholder.photo-pending{
  border:1px dashed rgba(255,180,60,.4)!important;
  background:rgba(40,30,15,.4)!important;
}

.photo-pending-notice{
  color:#ffc466!important;
  font-size:11px;
  line-height:1.35;
}

.photo-status-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:4px 8px;
  border-radius:4px;
  font-size:11px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.03em;
}

.photo-status-badge.pending{
  background:rgba(255,180,60,.15);
  color:#ffc466;
  border:1px solid rgba(255,180,60,.3);
}

.photo-status-badge.rejected{
  background:rgba(255,80,80,.15);
  color:#ff8585;
  border:1px solid rgba(255,80,80,.3);
}

/* GUIDES: preserve approved geometry; only change material/colors. */
#guides{
  color:var(--ocean-text);
}

#guides .guides-hero{
  background:
    radial-gradient(circle at 84% 12%,rgba(87,185,255,.13),transparent 34%),
    linear-gradient(150deg,#12304a,#0d2133);
  color:var(--ocean-text);
  border:1px solid rgba(87,185,255,.16);
  box-shadow:none;
}

#guides .guides-hero::after{
  content:none!important;
  display:none!important;
}

#guides .guides-hero .eyebrow{color:#ff9a4d}
#guides .guides-hero p{color:var(--ocean-muted)}

#guides .guides-create{
  background:var(--food);
  color:#111820;
  box-shadow:0 3px 0 #8b3b08;
}

#guides .guide-editorial-strip{
  border-bottom-color:rgba(167,190,206,.20);
}

#guides .guide-editorial-strip span{color:#ff9a4d}
#guides .guide-editorial-strip b{color:#a8bdcc}

#guides .library-link{
  color:#8fcbf7;
}

#guides .guide-card,
#guides .review-history{
  background:linear-gradient(180deg,#10283b,#0d2133);
  border-color:rgba(87,185,255,.16);
  color:var(--ocean-text);
  box-shadow:none;
}

#guides .guide-card-featured{
  background:
    radial-gradient(circle at 100% 0%,rgba(87,185,255,.10),transparent 38%),
    linear-gradient(145deg,#153550,#0d2133);
  border-color:rgba(87,185,255,.20);
  box-shadow:0 12px 28px rgba(1,8,14,.14);
}

#guides .guide-card-main>span,
#guides .guide-card-kicker,
#guides .guide-card span{
  color:#96afc0;
}

#guides .guide-mini-borough,
#guides .library-borough-filters button{
  background:#102a3f;
  border-color:var(--ocean-line);
  color:#a9c1d1;
}

#guides .review-library-heading{
  margin-top:20px!important;
  padding-top:14px!important;
  border-top:1px solid rgba(87,185,255,.16)!important;
}

/* RESTAURANT DETAIL */
#restaurant,
#restaurantDetail{
  color:var(--ocean-text);
}

#restaurantDetail .hero,
#restaurantDetail .dish-card,
#restaurantDetail .utility,
#restaurantDetail .work-panel,
#restaurantDetail .community-post,
#restaurantDetail .review-history{
  background:linear-gradient(180deg,#10283b,#0d2133);
  border-color:rgba(87,185,255,.16);
  color:var(--ocean-text);
  box-shadow:none;
}

#restaurantDetail .hero{
  box-shadow:0 10px 24px rgba(1,8,14,.14);
}

#restaurantDetail .headline-tag,
#restaurantDetail .subnav button,
#restaurantDetail .utility-actions button,
#restaurantDetail .confirm-row button,
#restaurantDetail .post-actions button{
  background:#102a3f;
  border-color:var(--ocean-line);
  color:#b3c9d7;
}

#restaurantDetail .subnav{
  background:linear-gradient(to bottom,rgba(7,21,33,.98) 72%,rgba(7,21,33,0));
}

#restaurantDetail .stat{
  background:#102a3f;
  border-color:rgba(87,185,255,.12);
}

#restaurantDetail .stat.food{
  background:#352315;
}

#restaurantDetail .stat-actions button{
  background:#0c2031;
  border-color:#294c65;
  color:#b8cbd7;
}

#restaurantDetail .dish-score{
  background:#352315;
  color:#ffb06f;
}

#restaurantDetail .community-post::before{
  background:var(--ocean-blue);
}

#restaurantDetail .my-discussion-post{
  background:#162b38;
  border-color:rgba(244,122,31,.25);
}

#restaurantDetail .discussion-primary-actions button{
  background:#102a3f!important;
  border-color:var(--ocean-line)!important;
  color:#a9c0d0!important;
}

#restaurantDetail .primary-wide,
#restaurantDetail .hero-actions .primary{
  background:var(--food);
  color:#101820;
}

#restaurantDetail .secondary,
#restaurantDetail .hero-actions button:not(.primary){
  background:#102a3f;
  border-color:var(--ocean-line);
  color:var(--ocean-text);
}

/* CHECK-IN */
#checkin{
  color:var(--ocean-text);
}

#checkin .checkin-shell{
  background:linear-gradient(180deg,#10283b 0%,#0a1b2a 100%);
  border-color:rgba(87,185,255,.17);
  box-shadow:0 14px 34px rgba(1,8,14,.20);
}

#checkin .checkin-head{
  background:
    radial-gradient(circle at 94% 8%,rgba(87,185,255,.14),transparent 31%),
    radial-gradient(circle at 8% 2%,rgba(244,122,31,.14),transparent 28%);
  border-bottom-color:rgba(167,190,206,.14);
}

#checkin .checkin-restaurant-name{
  background:rgba(167,190,206,.09);
  color:#b6c9d5;
}

#checkin .checkin-intro,
#checkin .checkin-step-head small,
#checkin .checkin-dish-copy .meta{
  color:#96adbc;
}

#checkin .checkin-step{
  background:rgba(255,255,255,.015);
  border-bottom-color:rgba(167,190,206,.12);
}

#checkin .checkin-step-head>span{
  background:var(--ocean-yellow);
  color:#101820;
}

#checkin .checkin-dish-card{
  background:#0e2436;
  border-color:rgba(87,185,255,.14);
  box-shadow:none;
}

#checkin .checkin-dish-card.selected{
  background:#162b38;
  border-color:rgba(244,122,31,.34);
}

#checkin .rate-row button,
#checkin .choice-row button{
  background:#102a3f;
  border-color:var(--ocean-line);
  color:#b5c9d6;
}

#checkin .rate-row button.active,
#checkin .choice-row button.active{
  background:var(--food);
  border-color:var(--food);
  color:#101820;
}

#checkin .checkin-score-guide,
#checkin .dish-public-note-wrap{
  background:#132638!important;
  border-color:rgba(87,185,255,.16)!important;
  color:#a8bdca!important;
}

#checkin .dish-public-note{
  background:#0b1d2c;
  border-color:var(--ocean-line);
  color:var(--ocean-text);
}

/* SIGNED-IN YOU. Signed-out You keeps its separate oversized composition. */
#you:not(:has(.profile-ocean-auth)){
  color:var(--ocean-text);
}

#you:not(:has(.profile-ocean-auth)) .profile-top{
  background:
    radial-gradient(circle at 92% 8%,rgba(87,185,255,.17),transparent 32%),
    linear-gradient(145deg,#12304a,#0d2133)!important;
  border-color:rgba(87,185,255,.18);
  box-shadow:0 4px 0 #06111a;
}

#you .profile-top::after{
  border-color:rgba(87,185,255,.18);
}

#you .profile-kicker{color:#ff9a4d}

#you .profile-actions button{
  background:rgba(167,190,206,.08);
  border-color:rgba(167,190,206,.12);
  color:var(--ocean-text);
}

#you .profile-actions button:first-child{
  background:var(--ocean-yellow);
  color:#101820;
}

#you .profile-dashboard-stats>div,
#you .profile-dashboard-stats>button{
  background:#102a3f!important;
  border-color:rgba(87,185,255,.14)!important;
}

#you .profile-dashboard-stats b,
#you .profile-dashboard-stats>button b{color:#ff9a4d!important}
#you .profile-dashboard-stats span{color:#93aaba}

#you .foodprint-card,
#you .status-card,
#you .profile-photo-card,
#you .contribution-card,
#you .featured-restaurant-card,
#you .eater-buddy-card,
#you .want-card{
  background:#0d2133!important;
  border-color:rgba(87,185,255,.15)!important;
  color:var(--ocean-text)!important;
  box-shadow:none!important;
}

#you .profile-taste-panel{
  background:transparent!important;
  border:0!important;
  border-top:1px solid var(--ocean-line)!important;
  border-radius:0!important;
  padding:14px 0!important;
  box-shadow:none!important;
}

/* Passive profile signals keep their grid but show the complete values. */
#you .profile-signal-row span{
  background:transparent;
  border:0;
  border-radius:0;
  padding:0!important;
  min-height:0;
}
#you .profile-signal-row small,
#you .profile-signal-row b{overflow:visible;white-space:normal;overflow-wrap:anywhere}

.foodprint span,
#you .profile-taste-panel .foodprint span,
#you .foodprint span{
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  padding:0!important;
  box-shadow:none!important;
  color:#b3c7d5!important;
}
.foodprint{gap:5px 0}
.foodprint span{font-size:12px;line-height:1.6;overflow-wrap:anywhere}
.foodprint span + span::before{content:'·';margin:0 7px;color:var(--muted)}

.review-dish-scores{display:flex;flex-wrap:wrap;gap:5px 0;margin-top:8px;color:#b3c7d5;font-size:12px;line-height:1.5}
.review-dish-scores>span{min-width:0;overflow-wrap:anywhere}
.review-dish-scores>span + span::before{content:'·';margin:0 7px;color:var(--muted)}
.review-dish-scores b{font-variant-numeric:tabular-nums;color:var(--ocean-text);font-weight:650}
.review-history .restaurant-status-badge,
.public-review-card .restaurant-status-badge,
.review-history .tiny-visit-badge,
.public-review-card .tiny-visit-badge{background:transparent;border:0;border-radius:0;padding:0;color:#92aabb;line-height:1.5}

#you .profile-taste-panel .foodprint-label,
#you .profile-taste-panel p,
#you .status-card span,
#you .profile-photo-card span,
#you .contribution-card small{
  color:#92aabb!important;
}

#you .profile-action-grid{
  border-top-color:rgba(167,190,206,.16);
}

#you .profile-action-grid button{
  border-bottom-color:rgba(167,190,206,.16)!important;
  color:#c7d7e1!important;
}

/* MODALS + AUTH */
.modal{
  background:rgba(0,5,10,.72);
}

.sheet{
  background:#0a1b2a;
  color:var(--ocean-text);
  border:1px solid rgba(87,185,255,.15);
  border-bottom:0;
}

.sheet p{color:#a9bdca}
.modal-x{color:#87a1b3}

.dark{
  background:var(--food);
  color:#101820;
}

.light,
.settings-list button{
  background:#102a3f;
  border-color:var(--ocean-line);
  color:var(--ocean-text);
}

.auth-success-state p{color:#96adbc}
.auth-success-icon{background:var(--ocean-yellow);color:#101820}

/* Desktop frame should feel like the same app, not a white phone mockup. */
@media(min-width:700px){
  body{background:#040b11}
  .app{
    border:1px solid rgba(87,185,255,.12);
    box-shadow:0 18px 60px rgba(0,0,0,.32);
  }
}



/* =========================================================
   DEETS AC5 auth ocean cleanup — 2026-09-21
   Auth stays single-column inside the 430px sheet at every viewport width.
   ========================================================= */

.auth-shell-redesign{
  grid-template-columns:1fr!important;
  min-height:0!important;
  margin:-4px;
  background:#081723!important;
  border:1px solid rgba(87,185,255,.16);
  box-shadow:none;
}

.auth-brand-panel{
  display:block!important;
  min-height:0;
  padding:20px 20px 18px!important;
  background:
    radial-gradient(circle at 88% -10%,rgba(87,185,255,.20),transparent 42%),
    linear-gradient(155deg,#12304a 0%,#0d2133 58%,#081723 100%)!important;
  border-bottom:1px solid rgba(87,185,255,.14);
}

.auth-brand-panel::after{
  right:-58px;
  bottom:-86px;
  width:190px;
  height:190px;
  border:30px solid rgba(87,185,255,.045);
}

.auth-brand-mark{
  margin:0 0 18px!important;
  color:#f3f8fb;
  font-size:30px;
}

.auth-brand-copy .eyebrow{
  margin-bottom:5px;
  color:#ff9a4d;
  font-size:9px;
}

.auth-brand-copy h2{
  margin:0 0 6px;
  max-width:none;
  color:#f3f8fb;
  font-size:32px;
  line-height:.98;
}

.auth-brand-copy p{
  max-width:34ch;
  color:#a9bfcd;
  font-size:11px;
}

.auth-brand-badges{
  margin-top:14px;
}

.auth-brand-badges span{
  border-color:rgba(167,190,206,.12);
  background:rgba(167,190,206,.06);
  color:#9fb5c4;
  font-size:7px;
}

.auth-panel{
  display:block!important;
  padding:18px 18px 20px!important;
  background:#081723!important;
}

.auth-shell-redesign .auth-tabs{
  margin-bottom:18px;
  border-color:rgba(87,185,255,.14);
  background:#0d2133;
}

.auth-shell-redesign .auth-tabs button{
  min-height:46px;
  color:#91a9ba;
  font-size:11px;
}

.auth-shell-redesign .auth-tabs button.active{
  background:var(--ocean-yellow);
  color:#101820;
  box-shadow:none;
}

.auth-mode-copy{
  margin-bottom:15px;
}

.auth-mode-copy b{
  color:#eef5f8;
  font-size:15px;
}

.auth-mode-copy span{
  color:#8fa8b8;
  font-size:10px;
}

.auth-shell-redesign .auth-field>span{
  color:#b6c9d6;
  font-size:10px;
}

.auth-shell-redesign .auth-field input{
  min-height:54px;
  border-color:#274a63;
  background:#0d2133;
  color:#eef5f8;
}

.auth-shell-redesign .auth-field input:focus{
  background:#102a3f;
  border-color:#57b9ff;
  box-shadow:0 0 0 3px rgba(87,185,255,.13);
}

.auth-shell-redesign .auth-submit{
  min-height:58px;
  margin-top:4px;
  background:var(--food);
  color:#101820;
  font-size:14px;
  box-shadow:0 6px 0 #8b3b08;
}

.auth-shell-redesign .forgot-password-link{
  margin-top:2px;
  color:#90aabd;
  font-size:10px;
}

.auth-shell-redesign .auth-note{
  margin-top:14px;
  color:#718b9d;
  font-size:9px;
}

@media(min-width:700px){
  .auth-shell-redesign{
    grid-template-columns:1fr!important;
    min-height:0!important;
  }
  .auth-brand-panel{
    display:block!important;
  }
  .auth-panel{
    display:block!important;
    padding:18px 18px 20px!important;
  }
}


/* =========================================================
   DEETS AC5 simple auth final — 2026-09-21
   One ocean form, no marketing/legacy side panel.
   ========================================================= */

.auth-shell-simple{
  display:block!important;
  min-height:0!important;
  margin:-4px;
  border:0;
  border-radius:22px;
  background:#081723!important;
  box-shadow:none;
}

.auth-shell-simple .auth-panel{
  display:block!important;
  padding:24px 20px 22px!important;
  background:
    radial-gradient(circle at 100% 0%,rgba(87,185,255,.10),transparent 38%),
    #081723!important;
}

.auth-simple-mark{
  margin:0 0 26px;
  color:#f3f8fb;
  font-size:30px;
  font-weight:950;
  line-height:1;
  letter-spacing:-.065em;
}

.auth-simple-mark span{
  color:var(--food);
}

.auth-shell-simple .auth-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:5px;
  margin:0 0 24px;
  padding:4px;
  border:1px solid rgba(87,185,255,.14);
  border-radius:15px;
  background:#0d2133;
}

.auth-shell-simple .auth-tabs button{
  min-height:48px;
  border:0;
  border-radius:11px;
  background:transparent;
  color:#91a9ba;
  font-size:12px;
  font-weight:900;
}

.auth-shell-simple .auth-tabs button.active{
  background:var(--ocean-yellow);
  color:#101820;
  box-shadow:none;
}

.auth-shell-simple .auth-mode-copy{
  margin:0 0 17px;
}

.auth-shell-simple .auth-mode-copy b{
  color:#eef5f8;
  font-size:26px;
  line-height:1;
  letter-spacing:-.04em;
}

.auth-shell-simple .auth-form{
  display:grid;
  gap:13px;
}

.auth-shell-simple .auth-field{
  gap:7px;
}

.auth-shell-simple .auth-field>span{
  color:#b6c9d6;
  font-size:11px;
  font-weight:850;
}

.auth-shell-simple .auth-field input{
  width:100%;
  min-height:56px;
  margin:0;
  border:1px solid #274a63;
  border-radius:14px;
  background:#0d2133;
  color:#eef5f8;
  font-size:16px;
}

.auth-shell-simple .auth-field input:focus{
  background:#102a3f;
  border-color:#57b9ff;
  box-shadow:0 0 0 3px rgba(87,185,255,.13);
}

.auth-shell-simple .auth-submit{
  min-height:60px;
  margin-top:3px;
  border-radius:15px;
  background:var(--food);
  color:#101820;
  font-size:15px;
  font-weight:950;
  box-shadow:0 6px 0 #8b3b08;
}

.auth-shell-simple .forgot-password-link{
  min-height:36px;
  margin:0;
  color:#8fa9ba;
  font-size:10px;
}

.auth-shell-simple .error{
  margin-top:0;
}

@media(min-width:700px){
  .auth-shell-simple,
  .auth-shell-simple .auth-panel{
    display:block!important;
  }
}


/* =========================================================
   DEETS AC5 rating intro contrast — 2026-09-21
   Keep the ratings explanation readable in the ocean modal.
   ========================================================= */

.sheet .rating-scale-card{
  margin-top:14px;
  padding:17px;
  border:1px solid #3d7393;
  border-radius:18px;
  background:
    linear-gradient(145deg,#1b4c69,#153b55);
  color:#f6fbff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}

.sheet .rating-scale-card b{
  display:block;
  color:#ffffff;
  font-size:15px;
  line-height:1.55;
}

.sheet .rating-scale-card span{
  display:block;
  margin-top:11px;
  color:#b9dcf2;
  font-size:11px;
  line-height:1.5;
}


/* =========================================================
   DEETS AC5 For when hero copy rotation — 2026-09-21
   Copy-only motion; approved Guides geometry stays unchanged.
   ========================================================= */

#guides .guides-hero-copy{
  min-width:0;
}

#guides .guides-hero-copy h1{
  margin:0 0 6px!important;
  font-size:26px!important;
  line-height:1.05!important;
  letter-spacing:-.04em;
}

#guides .guides-hero-rotator{
  position:relative;
  min-height:52px;
  max-width:300px;
  margin:0;
}

#guides .guides-hero-rotator>span{
  position:absolute;
  inset:0 auto auto 0;
  max-width:100%;
  color:var(--ocean-muted);
  font-size:11px;
  line-height:1.4;
  opacity:0;
  animation:guide-copy-fade 20s linear infinite;
  animation-delay:calc(var(--guide-copy-index) * 5s);
}

@keyframes guide-copy-fade{
  0%{opacity:0}
  2%,23%{opacity:1}
  25%,100%{opacity:0}
}

.screen:not(.active) .guides-hero-rotator>span{
  animation-play-state:paused;
}

@media(prefers-reduced-motion:reduce){
  #guides .guides-hero-rotator>span{
    animation:none!important;
    opacity:0;
  }
  #guides .guides-hero-rotator>span:first-child{
    opacity:1;
  }
}


/* =========================================================
   DEETS AC5 Guides hero spacing cleanup — 2026-09-21
   Small composition shift only; list behavior stays unchanged.
   ========================================================= */

#guides .guides-hero{
  align-items:flex-start;
}

#guides .guides-hero-copy{
  transform:translateX(12px);
  max-width:68%;
}

#guides .guides-create{
  margin-top:5px;
  margin-right:10px;
}

#guides .guide-library-heading{
  margin-top:18px!important;
}

/* Signed-out list voice: match canonical deep-ocean theme. */
#guides .guide-empty{
  background-color:#0d2133!important;
  background-image:linear-gradient(180deg,#10283b,#0d2133)!important;
  border:1px solid #23445e!important;
  border-left:4px solid #f47a1f!important;
  border-radius:17px!important;
  color:var(--ocean-text)!important;
  box-shadow:none!important;
}

#guides .guide-empty-elite .eyebrow{
  display:block;
  margin-bottom:8px;
  color:#ff9a4d!important;
  font-size:10px;
  font-weight:950;
  line-height:1.2;
  letter-spacing:.105em;
}

#guides .guide-empty b{
  color:var(--ocean-text)!important;
}

#guides .guide-empty-elite>span,
#guides .guide-empty span{
  display:block;
  margin-top:0;
  color:#96afc0!important;
  font-size:11px;
  line-height:1.55;
}

/* Keep the hero shift modest on the narrowest screens. */
@media(max-width:350px){
  #guides .guides-hero-copy{
    transform:translateX(8px);
    max-width:70%;
  }
  #guides .guides-create{
    margin-right:4px;
  }
}


/* =========================================================
   DEETS AC5 ocean word drift — 2026-09-21
   WHO ARE YOU moves noticeably; FIND YOUR EATER drifts gently.
   SIGN IN remains the static visual anchor.
   ========================================================= */

.profile-ocean-question span{
  --ocean-float-x:18px;
  --ocean-float-y:15px;
  animation:ocean-letter-drift 5.2s ease-in-out infinite;
  animation-delay:var(--ocean-float-delay,0s);
  will-change:translate;
}

.profile-ocean-question span:nth-child(1){--ocean-float-x:24px;--ocean-float-y:18px;--ocean-float-delay:-1.3s;animation-duration:5.6s}
.profile-ocean-question span:nth-child(2){--ocean-float-x:18px;--ocean-float-y:24px;--ocean-float-delay:-3.1s;animation-duration:6.2s}
.profile-ocean-question span:nth-child(3){--ocean-float-x:27px;--ocean-float-y:16px;--ocean-float-delay:-2.2s;animation-duration:4.9s}
.profile-ocean-question span:nth-child(4){--ocean-float-x:20px;--ocean-float-y:22px;--ocean-float-delay:-4.4s;animation-duration:6.7s}
.profile-ocean-question span:nth-child(5){--ocean-float-x:28px;--ocean-float-y:19px;--ocean-float-delay:-.8s;animation-duration:5.4s}
.profile-ocean-question span:nth-child(6){--ocean-float-x:21px;--ocean-float-y:25px;--ocean-float-delay:-2.8s;animation-duration:6.4s}
.profile-ocean-question span:nth-child(7){--ocean-float-x:26px;--ocean-float-y:20px;--ocean-float-delay:-3.7s;animation-duration:5.1s}
.profile-ocean-question span:nth-child(8){--ocean-float-x:22px;--ocean-float-y:17px;--ocean-float-delay:-1.9s;animation-duration:5.9s}
.profile-ocean-question span:nth-child(9){--ocean-float-x:24px;--ocean-float-y:23px;--ocean-float-delay:-4.9s;animation-duration:6.6s}

@keyframes ocean-letter-drift{
  0%,100%{translate:0 0}
  18%{translate:var(--ocean-float-x) calc(var(--ocean-float-y) * -1)}
  39%{translate:calc(var(--ocean-float-x) * -.72) var(--ocean-float-y)}
  61%{translate:calc(var(--ocean-float-x) * .82) calc(var(--ocean-float-y) * .58)}
  82%{translate:calc(var(--ocean-float-x) * -.58) calc(var(--ocean-float-y) * -.68)}
}

.profile-ocean-eater{
  animation:ocean-eater-drift 8.5s ease-in-out infinite;
  will-change:translate;
}

@keyframes ocean-eater-drift{
  0%,100%{translate:0 0}
  28%{translate:4px -2px}
  57%{translate:-3px 3px}
  80%{translate:2px 1px}
}

@media(prefers-reduced-motion:reduce){
  .profile-ocean-question span,
  .profile-ocean-eater{
    animation:none!important;
    translate:0 0!important;
    will-change:auto;
  }
}


/* =========================================================
   DEETS AC5 compact New list alignment — 2026-09-21
   Override the older mobile full-width/stacked button rule.
   ========================================================= */

#guides .guides-hero{
  flex-direction:row;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}

#guides .guides-hero-copy{
  min-width:0;
  flex:1 1 auto;
  max-width:72%;
}

#guides .guides-create{
  width:auto;
  min-width:0;
  flex:0 0 auto;
  margin-top:4px;
  margin-right:2px;
  padding:9px 11px;
  min-height:40px;
  white-space:nowrap;
}

@media(max-width:390px){
  #guides .guides-hero{
    flex-direction:row;
    align-items:flex-start;
  }

  #guides .guides-hero>div{
    max-width:72%;
  }

  #guides .guides-create{
    width:auto;
    padding:9px 10px;
    min-height:38px;
  }
}


/* =========================================================
   DEETS AC5 restaurant material cleanup — 2026-09-21
   One ocean hierarchy; orange only for food/primary actions.
   ========================================================= */

/* Scorecard: remove the old warm/brown tile and the pale wrapper. */
#restaurantDetail .stats{
  background:#0a1b2a;
  border-color:#23445e;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}

#restaurantDetail .stat{
  background:#12304a;
  border-color:#2a506b;
  color:#f2f7fa;
  box-shadow:none;
}

#restaurantDetail .stat span{
  color:#a7bece;
}

#restaurantDetail .stat.food{
  background:#153b55;
  border-color:rgba(244,122,31,.38);
  box-shadow:inset 3px 0 0 #f47a1f;
}

#restaurantDetail .stat.food b{
  color:#ff9a4d;
}

#restaurantDetail .stat.food span{
  color:#b9cedb;
}

/* Must Gets: one cool card material; food score owns the orange accent. */
#restaurantDetail .dish-card{
  background:#0d2133;
  border-color:#23445e;
  color:#f2f7fa;
  box-shadow:none;
}

#restaurantDetail .dish-card::before{
  background:#315975;
}

#restaurantDetail .dish-card.top{
  border-color:#315975;
  box-shadow:none;
}

#restaurantDetail .dish-card.top::before{
  background:#f47a1f;
}

#restaurantDetail .dish-card h4,
#restaurantDetail .dish-card.top h4{
  color:#f2f7fa;
}

#restaurantDetail .dish-card .meta{
  color:#8faabd;
}

#restaurantDetail .dish-community-hint{
  background:#102a3f;
  color:#78c8ff;
  border:1px solid rgba(87,185,255,.13);
}

#restaurantDetail .featured-note-byline,
#restaurantDetail .featured-note-byline>b{
  color:#9db4c4;
}

#restaurantDetail .featured-note-byline .featured-note-label{
  color:#7895aa;
}

#restaurantDetail .dish-score,
#restaurantDetail .dish-card.top .dish-score{
  background:#f47a1f;
  border-color:#f47a1f;
  color:#101820;
  box-shadow:none;
}

/* Mentionables is a full-width drill-down, with editorial dish dividers. */
#restaurantDetail .restaurant-mentionables{margin:12px 0;border-block:1px solid #23445e}
#restaurantDetail .restaurant-mentionables summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:64px;padding:12px;background:#102a3f;color:#f2f7fa;cursor:pointer;list-style:none}
#restaurantDetail .restaurant-mentionables summary::-webkit-details-marker{display:none}
#restaurantDetail .mentionables-copy,#restaurantDetail .mentionable-copy{display:grid;gap:4px;min-width:0;overflow-wrap:anywhere}
#restaurantDetail .mentionables-copy>b{font-size:14px}
#restaurantDetail .mentionables-copy>span,#restaurantDetail .mentionable-copy>span{font-size:11px;line-height:1.4;color:#8faabd}
#restaurantDetail .mentionables-chevron{font-size:24px;color:#78c8ff}
#restaurantDetail .restaurant-mentionables[open] .mentionables-chevron{transform:rotate(90deg)}
#restaurantDetail .mentionable-dish{display:flex;align-items:center;gap:12px;width:100%;min-height:56px;padding:12px;text-align:left;border:0;border-top:1px solid #23445e;border-radius:0;background:transparent;color:#f2f7fa;box-shadow:none;cursor:pointer}
#restaurantDetail .mentionable-copy{flex:1}
#restaurantDetail .mentionable-copy>b{font-size:13px}
#restaurantDetail .mentionable-score{font-weight:800;color:#ff9a4d}
#restaurantDetail .restaurant-mentionables summary:focus-visible,#restaurantDetail .mentionable-dish:focus-visible{outline:2px solid #78c8ff;outline-offset:2px}

/* Logistics: mid-depth marine tools, not light-theme cards. */
#restaurantDetail .utility{
  background:#12304a;
  border-color:#2a506b;
  color:#f2f7fa;
  box-shadow:none;
}

#restaurantDetail .utility strong{
  color:#f2f7fa;
}

#restaurantDetail .utility p,
#restaurantDetail .utility .meta,
#restaurantDetail .utility .phone-link{
  color:#a7bece;
}

#restaurantDetail .logistics-item-foot{
  border-top-color:#23445e;
}

#restaurantDetail .logistics-item-foot>span{
  color:#7895aa;
}

#restaurantDetail .logistics-add,
#restaurantDetail .logistics-item-foot button{
  background:#0a1b2a;
  border:1px solid #315975;
  color:#d8e7ef;
  box-shadow:none;
}

#restaurantDetail .logistics-tags span{
  background:#0a1b2a;
  border-color:#315975;
  color:#b9cfdd;
}

/* Work setup follows the same surface family. */
#restaurantDetail .work-panel{
  background:#0d2133;
  border-color:#23445e;
  box-shadow:none;
}

#restaurantDetail .work-item{
  background:#12304a;
  color:#f2f7fa;
}

#restaurantDetail .work-item b{
  color:#8faabd;
}

#restaurantDetail .work-item span{
  color:#f2f7fa;
}

#restaurantDetail .work-disclaimer{
  border-top-color:#23445e;
  color:#8faabd;
}

/* Discussion: dark reading surface + darker input well. */
#restaurantDetail .discussion-empty{
  background:#0d2133;
  border-color:#315975;
  color:#f2f7fa;
}

#restaurantDetail .discussion-empty b{
  color:#f2f7fa;
}

#restaurantDetail .discussion-empty span{
  color:#8faabd;
}

#restaurantDetail .discussion-composer{
  background:#12304a;
  border-color:#315975;
  color:#f2f7fa;
  box-shadow:none;
}

#restaurantDetail .discussion-composer-kicker{
  color:#ff9a4d;
}

#restaurantDetail .discussion-composer-head b{
  color:#f2f7fa;
}

#restaurantDetail .discussion-composer-head>span,
#restaurantDetail #discussionCount{
  color:#8faabd;
}

#restaurantDetail .discussion-input{
  background:#0a1b2a;
  border-color:#315975;
  color:#f2f7fa;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02);
}

#restaurantDetail .discussion-input::placeholder{
  color:#7895aa;
}

#restaurantDetail .discussion-input:focus{
  background:#0d2133;
  border-color:#57b9ff;
  box-shadow:0 0 0 3px rgba(87,185,255,.12);
}

#restaurantDetail #postDiscussion:not(:disabled){
  background:#f47a1f!important;
  border-color:#f47a1f!important;
  color:#101820!important;
}

#restaurantDetail #postDiscussion:disabled{
  background:#6e8291!important;
  border-color:#6e8291!important;
  color:#e9f0f4!important;
  opacity:.62;
}

#restaurantDetail .community-post{
  background:#0d2133;
  border-color:#23445e;
  color:#f2f7fa;
}

#restaurantDetail .discussion-post-body{
  color:#dce7ed;
}

#restaurantDetail .post-user-link,
#restaurantDetail .thread-user{
  color:#f2f7fa;
}

#restaurantDetail .discussion-post-date{
  color:#7895aa;
}

#restaurantDetail .discussion-thread{
  border-top-color:#23445e;
}

#restaurantDetail .discussion-thread-item{
  background:#102a3f;
  border-color:#2a506b;
  color:#dce7ed;
}

/* Keep section/meta text coherent on the dark page. */
#restaurantDetail .section-title span{
  color:#8faabd;
}

#restaurantDetail .phone-link:hover,
#restaurantDetail .dish-community-hint:hover{
  color:#b9e1ff;
}


/* =========================================================
   DEETS AC5 food score blast — 2026-09-21
   Score intensity is intentionally loud and a little janky.
   ========================================================= */

#restaurantDetail .stat.food{
  position:relative;
  overflow:visible;
  border:1px solid #315975;
  box-shadow:none;
}

/* Unrated remains part of the normal ocean scorecard. */
#restaurantDetail .stat.food.score-unrated{
  background:#153b55;
  color:#f2f7fa;
}

/* Below 4: deliberately plain white. */
#restaurantDetail .stat.food.score-low{
  background:#f2f7fa;
  border-color:#f2f7fa;
  color:#071521;
}

#restaurantDetail .stat.food.score-low b,
#restaurantDetail .stat.food.score-low span{
  color:#071521;
}

/* 4.0–4.2: solid orange, no halo. */
#restaurantDetail .stat.food.score-good{
  background:#f47a1f;
  border-color:#ff9a4d;
  color:#101820;
}

#restaurantDetail .stat.food.score-good b,
#restaurantDetail .stat.food.score-good span{
  color:#101820;
}

/* 4.3–4.9: same orange tile, but the orange surrounds the WHOLE box. */
#restaurantDetail .stat.food.score-glow,
#restaurantDetail .stat.food.score-five{
  background:#f47a1f;
  border-color:#ffb066;
  color:#101820;
  box-shadow:
    0 0 0 3px rgba(244,122,31,.34),
    0 0 22px 5px rgba(244,122,31,.44);
}

#restaurantDetail .stat.food.score-glow b,
#restaurantDetail .stat.food.score-glow span,
#restaurantDetail .stat.food.score-five b,
#restaurantDetail .stat.food.score-five span{
  color:#101820;
}



/* =========================================================
   DEETS AC5 ranked Home score ladder — 2026-09-21
   Progressive emphasis: rank color -> score color -> aura -> 5.0 motion.
   ========================================================= */

/* Top-three hierarchy is limited to the main ranked Home list. */
#home .restaurant-card.home-rank-1{
  border-color:#c9540b;
  background:
    radial-gradient(circle at 88% 10%,rgba(244,122,31,.10),transparent 34%),
    linear-gradient(180deg,#153b55,#0d2133);
  animation:home-rank-one-breathe 7.5s ease-in-out infinite;
}

#home .restaurant-card.home-rank-2{
  border-color:#d96b22;
  background:linear-gradient(180deg,#143650,#0d2133);
}

#home .restaurant-card.home-rank-3{
  border-color:#e58a48;
  background:linear-gradient(180deg,#112d43,#0d2133);
}

@keyframes home-rank-one-breathe{
  0%,78%,100%{box-shadow:0 2px 0 rgba(255,255,255,.015)}
  86%{box-shadow:0 0 0 1px rgba(244,122,31,.26),0 0 18px rgba(244,122,31,.16)}
  93%{box-shadow:0 0 0 2px rgba(244,122,31,.18),0 0 24px rgba(244,122,31,.12)}
}

/* <4.0 stays quiet. */
#home .restaurant-card .scorebox.home-score-low,
#home .restaurant-card .scorebox.home-score-unrated{
  background:rgba(244,122,31,.13);
  border-color:rgba(255,154,77,.28);
  color:#ffb06f;
  box-shadow:none;
}

/* 4.0–4.2: darker orange, no aura. */
#home .restaurant-card .scorebox.home-score-good{
  background:#b84f0d;
  border-color:#d9681f;
  color:#fff7ef;
  box-shadow:none;
}

/* 4.3–4.9: darker orange plus a compact aura around the score. */
#home .restaurant-card .scorebox.home-score-glow,
#home .restaurant-card .scorebox.home-score-five{
  background:#b84f0d;
  border-color:#f47a1f;
  color:#fff7ef;
  box-shadow:
    0 0 0 2px rgba(244,122,31,.28),
    0 0 13px 4px rgba(244,122,31,.34);
}

/* 5.0 only: one short jiggle/blast roughly every ten seconds. */
#home .restaurant-card .scorebox.home-score-five{
  transform-origin:50% 55%;
  animation:home-five-score-cycle 10s ease-in-out infinite;
  will-change:transform,box-shadow;
}

@keyframes home-five-score-cycle{
  0%,2%,100%{
    transform:translate3d(0,0,0) rotate(0deg) scale(1);
    box-shadow:0 0 0 2px rgba(244,122,31,.28),0 0 13px 4px rgba(244,122,31,.34);
  }
  3%{
    transform:translate3d(-3px,0,0) rotate(-2deg) scale(1.035);
    box-shadow:0 0 0 4px rgba(244,122,31,.42),0 0 21px 8px rgba(244,122,31,.48);
  }
  4%{transform:translate3d(4px,-1px,0) rotate(2.2deg) scale(1.05)}
  5%{transform:translate3d(-3px,1px,0) rotate(-1.5deg) scale(1.03)}
  6%{transform:translate3d(2px,0,0) rotate(.8deg) scale(1.015)}
  8%{
    transform:translate3d(0,0,0) rotate(0deg) scale(1);
    box-shadow:0 0 0 2px rgba(244,122,31,.28),0 0 13px 4px rgba(244,122,31,.34);
  }
}

/* Detail page follows the same motion rule: only a displayed 5.0 moves. */
#restaurantDetail .stat.food.score-rated{
  animation:none;
}

#restaurantDetail .stat.food.score-five{
  transform-origin:50% 55%;
  animation:detail-five-score-cycle 10s ease-in-out infinite;
  will-change:transform,box-shadow,filter;
}

@keyframes detail-five-score-cycle{
  0%,2%,100%{
    transform:translate3d(0,0,0) rotate(0deg) scale(1);
    box-shadow:0 0 0 3px rgba(244,122,31,.34),0 0 22px 5px rgba(244,122,31,.44);
    filter:brightness(1);
  }
  3%{
    transform:translate3d(-5px,1px,0) rotate(-2.4deg) scale(1.04);
    box-shadow:0 0 0 7px rgba(244,122,31,.62),0 0 34px 13px rgba(255,216,77,.62);
    filter:brightness(1.22);
  }
  4.2%{transform:translate3d(5px,-2px,0) rotate(2.1deg) scale(1.06)}
  5.4%{transform:translate3d(-4px,1px,0) rotate(-1.6deg) scale(1.035)}
  6.6%{transform:translate3d(3px,-1px,0) rotate(1.1deg) scale(1.02)}
  8%{
    transform:translate3d(0,0,0) rotate(0deg) scale(1);
    box-shadow:0 0 0 3px rgba(244,122,31,.34),0 0 22px 5px rgba(244,122,31,.44);
    filter:brightness(1);
  }
}

@media(prefers-reduced-motion:reduce){
  #home .restaurant-card.home-rank-1,
  #home .restaurant-card .scorebox.home-score-five,
  #restaurantDetail .stat.food.score-five{
    animation:none!important;
  }
}


/* =========================================================
   DEETS AC5 balanced NYC map stage — 2026-09-21
   Horizontal artwork stays fixed and fully visible; borough selection only filters pins.
   ========================================================= */

#map .empty-map{
  position:relative;
  width:calc(100% + 32px);
  height:280px;
  margin-left:-16px;
  overflow:hidden;
  border-radius:20px;
  background:none!important;
}

#map .map-stage{
  position:absolute;
  inset:0;
  z-index:1;
}

#map .map-artwork{
  position:absolute;
  z-index:0;
  left:50%;
  top:50%;
  max-width:none;
  max-height:none;
  object-fit:contain;
  transform-origin:50% 50%;
  pointer-events:none;
  user-select:none;
  -webkit-user-drag:none;
}

#map .map-pop{
  z-index:20!important;
}

/* The citywide control is a real selected state, not a pale reset button. */
#map .map-focuses button.reset-map.active{
  background:var(--ocean-yellow)!important;
  border-color:var(--ocean-yellow)!important;
  color:#101820!important;
}

#map .map-focuses button.reset-map:not(.active){
  background:#0b1d2c!important;
  border-color:var(--ocean-line)!important;
  color:var(--ocean-muted)!important;
}

/* =========================================================
   Guides canonical mobile composition
   Folded from the former guides-layout-fix.css.
   ========================================================= */

#guides .guides-hero{
  position:relative;
  overflow:hidden!important;
  height:188px!important;
  min-height:188px!important;
}

/* Move tagline group to upper-right portion above + New list button */
#guides .guides-hero-copy{
  position:relative;
  z-index:2;
  box-sizing:border-box;
  width:55%!important;
  max-width:55%!important;
  margin-left:45%!important;
  padding:14px 4px 6px 10px!important;
  text-align:left;
}

#guides .guides-hero-copy h1,
#guides .guides-hero-copy p,
#guides .guides-hero-copy .eyebrow{
  position:relative;
  z-index:2;
}

/* Mascot stays as faded background art and is intentionally cropped low. */
#guides .guides-hero-ghost{
  position:absolute;
  z-index:1;
  left:-78px!important;
  right:auto!important;
  top:-12px!important;
  bottom:auto!important;
  width:315px!important;
  height:auto!important;
  max-height:none!important;
  opacity:.22!important;
  filter:saturate(.9) contrast(.95)!important;
  pointer-events:none;
  user-select:none;
}

#guides .guide-editorial-strip{
  padding-left:18px;
}

#guides .guide-editorial-strip b{
  padding-left:4px;
}

@media(max-width:430px){
  #guides .guides-hero{
    height:auto!important;
    min-height:182px!important;
    padding:14px 12px!important;
  }

  #guides .guides-hero-copy{
    width:58%!important;
    max-width:58%!important;
    margin-left:42%!important;
    padding:12px 2px 6px 8px!important;
  }

  #guides .guides-hero-ghost{
    left:-72px!important;
    top:-8px!important;
    width:292px!important;
    opacity:.20!important;
  }

  #guides .guide-editorial-strip{
    padding-left:20px;
  }
}

@media(max-width:360px){
  #guides .guides-hero{
    height:auto!important;
    min-height:178px!important;
  }

  #guides .guides-hero-copy{
    width:58%!important;
    max-width:58%!important;
    margin-left:42%!important;
    padding:10px 0 5px 8px!important;
  }

  #guides .guides-hero-ghost{
    left:-78px!important;
    top:-7px!important;
    width:275px!important;
    opacity:.18!important;
  }
}


/* =========================================================
   DEETS AC6 comfort dark-surface pass — 2026-09-21
   Remove leftover light-theme cards from the dark ocean UI.
   Layout, data behavior, map geometry, and score semantics stay unchanged.
   ========================================================= */

/* YOU: legacy cream/white surfaces become low-glare ocean materials. */
#you:not(:has(.profile-ocean-auth)) .profile-invite-reward{
  background:#12304a!important;
  border-color:#2a506b!important;
  color:var(--ocean-text)!important;
  box-shadow:none!important;
}
#you:not(:has(.profile-ocean-auth)) .profile-invite-reward p,
#you:not(:has(.profile-ocean-auth)) .profile-invite-kicker,
#you:not(:has(.profile-ocean-auth)) .profile-invite-waiting{
  color:#9db4c4!important;
}
#you:not(:has(.profile-ocean-auth)) .profile-invite-progress-track{
  background:#0a1b2a!important;
}
#you:not(:has(.profile-ocean-auth)) .profile-invite-progress-track>span{
  background:var(--food)!important;
}
#you:not(:has(.profile-ocean-auth)) .profile-invite-reward button{
  background:#0a1b2a!important;
  border:1px solid #315975!important;
  color:#dce7ed!important;
}
#you:not(:has(.profile-ocean-auth)) .loading-card{
  background:#0d2133!important;
  border-color:#23445e!important;
  color:#9db4c4!important;
  box-shadow:none!important;
}
#you:not(:has(.profile-ocean-auth)) .profile-photo-tools input{
  background:#0d2133!important;
  border-color:#315975!important;
  color:var(--ocean-text)!important;
  box-shadow:none!important;
}
#you:not(:has(.profile-ocean-auth)) .profile-photo-tools input::placeholder{
  color:#7895aa!important;
}
#you:not(:has(.profile-ocean-auth)) .profile-photo-tools button{
  color:#9db4c4!important;
}

/* GUIDES: keep the approved layout, replace only leftover cream list cards. */
#guides .guide-card,
#guides .guide-card-featured{
  background:linear-gradient(180deg,#10283b,#0d2133)!important;
  border-color:#23445e!important;
  border-radius:14px!important;
  padding:9px 12px 9px 14px!important;
  min-height:auto!important;
  color:var(--ocean-text)!important;
  box-shadow:none!important;
}
#guides .guide-card-title,
#guides .guide-card b{
  color:var(--ocean-text)!important;
}
#guides .guide-card-kicker,
#guides .guide-card-main>span,
#guides .guide-card span{
  color:#96afc0!important;
}
#guides .guide-card::before{
  opacity:.72;
}

/* RESTAURANT: S nomination and logistics must stay in the same marine system. */
#restaurantDetail .restaurant-s-panel,
#restaurantDetail .restaurant-s-panel.pending{
  background:#0d2133!important;
  border-color:#315975!important;
  color:var(--ocean-text)!important;
  box-shadow:none!important;
}
#restaurantDetail .restaurant-s-panel p{
  color:#9db4c4!important;
}
#restaurantDetail .restaurant-s-mark{
  background:#102a3f!important;
  border-color:#6d8ca1!important;
  color:#dce7ed!important;
}
#restaurantDetail .restaurant-s-panel button{
  background:#102a3f!important;
  border:1px solid #315975!important;
  color:#b9cfdd!important;
}
#restaurantDetail .utility{
  background:#12304a!important;
  border-color:#2a506b!important;
  color:var(--ocean-text)!important;
}
#restaurantDetail .utility p,
#restaurantDetail .utility .meta,
#restaurantDetail .utility .phone-link{
  color:#a7bece!important;
}


/* =========================================================
   DEETS AC6 social toggle + S nomination energy — 2026-09-21
   Tighten the collapsed community toggle and give the S nomination card
   its distinct purple energy without changing any behavior or layout flow.
   ========================================================= */

/* WHAT'S POPPIN? collapsed control: true circle centering + copy clearance. */
#home .social-card.collapsed{
  padding-right:48px!important;
}
#home .social-card.collapsed .kicker,
#home .social-card.collapsed .social-heading{
  padding-right:0!important;
  max-width:calc(100% - 2px);
}
#home .social-card.collapsed .social-minimize{
  top:50%;
  right:10px;
  width:26px;
  height:26px;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  text-indent:3px;
  transform:translateY(-50%);
}

/* S nomination: deep purple identity with brief animal-like energy bursts. */
#restaurantDetail .restaurant-s-panel.nominate{
  position:relative;
  overflow:visible;
  background:
    radial-gradient(circle at 84% 18%,rgba(167,139,250,.13),transparent 34%),
    linear-gradient(145deg,#251f3a,#17142a 68%,#111827)!important;
  border:1px solid #5f4aa8!important;
  color:#f3efff!important;
  box-shadow:
    0 0 0 1px rgba(167,139,250,.08),
    0 0 18px rgba(95,74,168,.12)!important;
  animation:s-nom-card-burst 6.8s ease-in-out infinite;
}
#restaurantDetail .restaurant-s-panel.nominate::after{
  content:"";
  position:absolute;
  inset:-4px;
  border-radius:20px;
  border:1px solid rgba(167,139,250,.0);
  pointer-events:none;
  opacity:0;
  animation:s-nom-aura-burst 6.8s ease-in-out infinite;
}
#restaurantDetail .restaurant-s-panel.nominate p{
  color:#b9addf!important;
}
#restaurantDetail .restaurant-s-panel.nominate b{
  color:#ddd4ff!important;
}
#restaurantDetail .restaurant-s-panel.nominate .restaurant-s-mark{
  background:#32245b!important;
  border:2px solid #a78bfa!important;
  color:#f6f1ff!important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.035),
    0 0 13px rgba(167,139,250,.22);
  animation:s-nom-mark-burst 6.8s cubic-bezier(.2,.8,.2,1) infinite;
  transform-origin:50% 55%;
}
#restaurantDetail .restaurant-s-panel.nominate #nominateForS{
  background:#6f54c9!important;
  border:1px solid #a78bfa!important;
  color:#fff!important;
  box-shadow:0 0 12px rgba(111,84,201,.20)!important;
}
#restaurantDetail .restaurant-s-panel.nominate #nominateForS:active{
  transform:translateY(1px) scale(.98);
}

@keyframes s-nom-card-burst{
  0%,70%,86%,100%{
    transform:translate3d(0,0,0);
    box-shadow:0 0 0 1px rgba(167,139,250,.08),0 0 18px rgba(95,74,168,.12);
  }
  73%{transform:translate3d(-1px,0,0) rotate(-.15deg)}
  75%{transform:translate3d(2px,-1px,0) rotate(.2deg)}
  77%{transform:translate3d(-2px,1px,0) rotate(-.18deg)}
  79%{transform:translate3d(1px,0,0) rotate(.1deg)}
  82%{
    transform:translate3d(0,0,0);
    box-shadow:0 0 0 2px rgba(167,139,250,.18),0 0 24px rgba(111,84,201,.24);
  }
}
@keyframes s-nom-mark-burst{
  0%,69%,85%,100%{transform:translate3d(0,0,0) rotate(0) scale(1)}
  72%{transform:translate3d(-3px,0,0) rotate(-6deg) scale(1.04)}
  74%{transform:translate3d(4px,-1px,0) rotate(7deg) scale(1.08)}
  76%{transform:translate3d(-3px,1px,0) rotate(-5deg) scale(1.05)}
  78%{transform:translate3d(3px,0,0) rotate(4deg) scale(1.07)}
  80%{transform:translate3d(-1px,-1px,0) rotate(-2deg) scale(1.04)}
  83%{transform:translate3d(0,0,0) rotate(0) scale(1)}
}
@keyframes s-nom-aura-burst{
  0%,69%,85%,100%{opacity:0;border-color:rgba(167,139,250,0)}
  74%{opacity:.85;border-color:rgba(167,139,250,.38)}
  80%{opacity:.45;border-color:rgba(111,84,201,.24)}
}

@media(prefers-reduced-motion:reduce){
  #restaurantDetail .restaurant-s-panel.nominate,
  #restaurantDetail .restaurant-s-panel.nominate::after,
  #restaurantDetail .restaurant-s-panel.nominate .restaurant-s-mark{
    animation:none!important;
    transform:none!important;
  }
}


/* =========================================================
   DEETS AC6 Guides signed-out comfort pass — 2026-09-21
   Keep signed-out Reviews on-theme and slightly calm the Guides CTA.
   No layout, copy, or behavior changes.
   ========================================================= */

#guides #reviewHistory .loading-card{
  background:#0d2133!important;
  border-color:#23445e!important;
  color:#a7bece!important;
  box-shadow:none!important;
}

#guides .guides-create{
  background:#d9681f!important;
  border-color:#d9681f!important;
  color:#101820!important;
  box-shadow:0 2px 0 #7a350b!important;
}


/* =========================================================
   DEETS AC6 legacy-white control cleanup — 2026-09-21
   Match leftover Guides/You controls to the existing dark-blue ocean material.
   Layout and behavior remain unchanged.
   ========================================================= */

/* GUIDES: list actions and review-note controls use the same marine material
   already used by the Your Photos cards/search. */
#guides .guide-add-current{
  grid-column:1/-1!important;
  width:100%!important;
  margin-top:10px!important;
  background:#102a3f!important;
  border:1px solid #2a506b!important;
  color:#f2f7fa!important;
  box-shadow:none!important;
}
#guides .guide-card-meta{
  border-top:none!important;
  margin-top:2px!important;
  padding-top:0!important;
}
.guide-visibility-badge.public,
.guide-visibility-badge.private,
#guides .guide-visibility-badge.public,
#guides .guide-visibility-badge.private{
  background:#12304a!important;
  border:1px solid #2a506b!important;
  color:#b9cfdd!important;
  padding:2px 6px!important;
  font-size:8px!important;
  line-height:1!important;
}

/* LIST DETAIL MODAL & EDIT LIST */
.guide-detail-title-row{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:6px;
}
.guide-detail-title-row h2{
  margin:0;
  margin-right:auto!important;
  color:var(--ocean-text)!important;
}
.guide-detail-header-actions{
  display:inline-flex;
  align-items:center;
  gap:8px;
  flex-shrink:0;
}
.guide-edit-btn{
  background:#102a3f!important;
  border:1px solid #2a506b!important;
  color:#dce7ed!important;
  border-radius:999px!important;
  padding:4px 11px!important;
  font-size:11px!important;
  font-weight:700!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:4px!important;
  cursor:pointer;
  transition:background .15s ease, border-color .15s ease, color .15s ease;
}
.guide-edit-btn:hover{
  background:#183e5c!important;
  border-color:#3d7299!important;
  color:#fff!important;
}
.guide-detail-desc{
  color:#a9bdca!important;
  margin:4px 0 12px!important;
  font-size:13px;
  line-height:1.45;
}
.guide-detail-list{
  display:grid;
  gap:8px;
  margin-top:10px;
}
.guide-detail-item-wrap{
  display:flex;
  align-items:center;
  gap:6px;
  width:100%;
}
.guide-detail-item-wrap .guide-detail-item{
  flex:1;
  min-width:0;
}
.guide-detail-item{
  width:100%;
  display:grid;
  grid-template-columns:32px 1fr auto;
  align-items:center;
  gap:10px;
  min-height:66px;
  border:1px solid #23445e!important;
  border-radius:15px!important;
  background:#0d2133!important;
  padding:10px 12px;
  text-align:left;
  cursor:pointer;
  transition:background .15s ease, border-color .15s ease;
}
.guide-detail-item:hover{
  background:#122c42!important;
  border-color:#305878!important;
}
.guide-detail-number{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#15324b!important;
  border:1px solid #2a506b!important;
  color:#dce7ed!important;
  font-size:10px;
  font-weight:900;
  font-variant-numeric:tabular-nums;
}
.guide-detail-copy{
  min-width:0;
}
.guide-detail-copy b{
  color:#f3f8fb!important;
  font-size:13px;
  font-weight:700;
}
.guide-detail-copy span{
  color:var(--ocean-muted)!important;
  font-size:11px;
}
.guide-detail-copy em{
  color:#ffb84d!important;
  font-size:11px;
  font-style:normal;
  font-weight:800;
}
.guide-detail-copy small{
  color:#a0b8c8!important;
  font-size:11px;
  line-height:1.4;
}
.guide-detail-arrow{
  color:#5c7d95!important;
  font-size:18px;
}
.guide-item-remove{
  background:transparent;
  border:1px solid transparent;
  color:#5c7d95;
  font-size:13px;
  padding:6px 9px;
  border-radius:10px;
  cursor:pointer;
  transition:color .15s ease, background .15s ease, border-color .15s ease;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.guide-item-remove:hover{
  color:#ff7d7d!important;
  background:rgba(255,100,100,.12)!important;
  border-color:rgba(255,100,100,.25)!important;
}
.guide-empty,
.sheet .guide-empty,
.sheet .loading-card{
  background:#0d2133!important;
  border:1px dashed #2a506b!important;
  border-radius:15px!important;
  color:#a9bdca!important;
  padding:15px;
}
.guide-empty b,
.sheet .guide-empty b{
  color:#f3f8fb!important;
}
.guide-empty span,
.sheet .guide-empty span{
  color:#8fa9ba!important;
}

/* EDIT LIST & CREATE LIST FORM IN OCEAN THEME */
.guide-edit-modal,
.guide-create-modal{
  background:#0a1b2a!important;
  border:1px solid rgba(87,185,255,.2)!important;
  border-radius:18px!important;
  box-shadow:none!important;
}
.guide-edit-modal h2,
.guide-create-modal h2{
  color:var(--ocean-text)!important;
}
.guide-edit-modal p,
.guide-create-content p{
  color:#a9bdca!important;
}
.guide-create-modal .guide-create-ghost{
  filter:invert(1) brightness(0.8)!important;
  opacity:.08!important;
}
.guide-form{
  display:grid;
  gap:11px;
  margin-top:12px;
}
.guide-form label{
  color:#c5d9e6!important;
  font-size:12px;
  font-weight:700;
  display:grid;
  gap:4px;
}
.guide-form label span.meta{
  color:var(--ocean-muted)!important;
  font-weight:normal;
}
.guide-form input[type="text"],
.guide-form input:not([type]),
.guide-form textarea{
  background:#0d2133!important;
  border:1px solid #2a506b!important;
  color:#f3f8fb!important;
  border-radius:10px!important;
  padding:10px 12px;
  font-size:14px;
  width:100%;
}
.guide-form input:focus,
.guide-form textarea:focus{
  border-color:#57b9ff!important;
  outline:none;
  box-shadow:0 0 0 2px rgba(87,185,255,.2)!important;
}
.guide-visibility-row{
  display:flex!important;
  flex-direction:row!important;
  align-items:flex-start;
  gap:10px;
  cursor:pointer;
  padding:6px 0;
}
.guide-visibility-row input[type="checkbox"]{
  margin-top:3px;
  accent-color:#57b9ff;
  width:16px;
  height:16px;
  flex-shrink:0;
}
.guide-visibility-row span{
  display:grid;
  gap:2px;
}
.guide-visibility-row span b{
  color:#f3f8fb!important;
  font-size:13px;
}
.guide-visibility-row span small{
  color:#8fa9ba!important;
  font-size:11px;
  font-weight:normal;
}
#guides .guide-card-arrow{
  align-self:center!important;
  width:24px!important;
  height:24px!important;
  border-radius:50%!important;
  display:grid!important;
  place-items:center!important;
  background:#102a3f!important;
  border:1px solid #2a506b!important;
  color:#b9cfdd!important;
  font-size:13px!important;
  line-height:1!important;
  flex-shrink:0!important;
}
#guides .private-note{
  background:#0d2133!important;
  border:1px solid #2a506b!important;
  color:#dce7ed!important;
}
#guides .private-note .meta{
  color:#8faabd!important;
}
#guides .pencil{
  background:#102a3f!important;
  border:1px solid #2a506b!important;
  color:#f2f7fa!important;
}

#restaurantDetail .work-item:last-child:nth-child(odd){
  grid-column:1/-1;
}

/* YOU: Eater Buddy action should not fall back to the legacy white button. */
#you .eater-buddy-actions button{
  background:#102a3f!important;
  border:1px solid #2a506b!important;
  color:#f2f7fa!important;
  box-shadow:none!important;
}
#you .eater-buddy-actions .eater-buddy-not-now{
  background:transparent!important;
  border-color:transparent!important;
  color:#8faabd!important;
}


/* DEETS AC6 guide accent rail width — 2026-09-21
   Slightly strengthen the colored list rails without changing card geometry. */
#guides .guide-card::before{
  width:4px!important;
}


/* Work friendly remains actionable; Group friendly is quiet metadata. */
#restaurantDetail .headline-tag.work{
  background:#0c2233!important;
  border:1px solid #315975!important;
  color:#a9c1d1!important;
}
#restaurantDetail .headline-tag.group{
  background:transparent!important;
  border:1px solid transparent!important;
  border-radius:0!important;
  color:var(--ocean-muted)!important;
  font-weight:400;
  box-shadow:none;
  backdrop-filter:none;
  cursor:inherit;
}


/* DEETS AC6 home practical badge contrast fix — 2026-09-21
   The Home restaurant-card badges are .quick-badge, not restaurant-detail
   .headline-tag controls. Darken the actual pills shown in the card. */
#home .restaurant-card .quick-badge{
  background:#d9e6e7!important;
  border:1px solid #a9c2c8!important;
  color:#28404b!important;
}
#home .restaurant-card .quick-badge.group{
  background:transparent!important;
  border-radius:0!important;
  border:0;
  color:var(--ocean-muted)!important;
  font-weight:400;
  box-shadow:none;
  cursor:inherit;
}


/* AC7 — native iOS visual centering for the signed-out CTA. */
html.deets-native-ios .profile-ocean-signin{
  transform:translateX(-8px) rotate(-1.2deg);
}
html.deets-native-ios .profile-ocean-signin:active{
  transform:translateX(-8px) rotate(-1.2deg) translateY(3px) scale(.99);
}


/* AC7 — shared signed-out YOU background continuity.
   One full-page ocean gradient sits behind the top bar, YOU composition, and
   bottom navigation so web, Android, and iOS do not show hard color seams. */
body:has(#you.active .profile-ocean-auth){
  background:
    radial-gradient(circle at 76% 2%,rgba(87,185,255,.13),transparent 31rem),
    linear-gradient(180deg,#0b2234 0%,#071521 52%,#040c13 100%) fixed!important;
}

body:has(#you.active .profile-ocean-auth) .app{
  background:transparent!important;
}

body:has(#you.active .profile-ocean-auth) .topbar{
  background:transparent!important;
  border-bottom-color:transparent!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  box-shadow:none!important;
}

body:has(#you.active .profile-ocean-auth) #you,
body:has(#you.active .profile-ocean-auth) .profile-ocean-auth{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

body:has(#you.active .profile-ocean-auth) #you::after{
  content:none!important;
}


/* Native iOS signed-out YOU: one viewport-sized background, with the artwork
   filling the space between the top bar and existing native nav clearance.
   Match the shared :has selector so these iOS rules win the actual cascade. */
html.deets-native-ios{
  background:#040c13!important;
}

html.deets-native-ios body:has(#you.active .profile-ocean-auth){
  background:
    radial-gradient(ellipse at 76% 2%,rgba(87,185,255,.13),transparent 70%),
    linear-gradient(180deg,#0b2234 0%,#071521 52%,#040c13 88%,#040c13 100%)!important;
  background-attachment:fixed!important;
}

html.deets-native-ios body:has(#you.active .profile-ocean-auth) .app{
  height:100dvh;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
}

html.deets-native-ios body:has(#you.active .profile-ocean-auth) main{
  display:grid;
  min-height:0;
}

html.deets-native-ios #you.active:has(.profile-ocean-auth){
  min-height:0;
  margin:0;
}

html.deets-native-ios #you.active:has(.profile-ocean-auth) #profile,
html.deets-native-ios #you.active .profile-ocean-auth{
  height:100%;
  min-height:0;
}

/* Keep the CTA, links, and caption in flow so shorter artwork cannot make
   their previous percentage-based positions overlap each other. */
html.deets-native-ios #you.active .profile-ocean-auth{
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding-bottom:24px;
}

html.deets-native-ios #you.active .profile-ocean-entry{
  position:relative;
  top:auto;
  transform:none;
  padding-bottom:20px;
}

html.deets-native-ios #you.active .profile-ocean-eater{
  position:relative;
  bottom:auto;
  flex-shrink:0;
}

/* The glow now belongs to the single page background, avoiding a new edge
   where the artwork begins below the top bar. */
html.deets-native-ios #you.active .profile-ocean-auth::before{
  content:none;
}

/* AC7 — shared ocean modal surfaces for dish notes and Discussion.
   These open on every platform, so keep them in the shared theme layer. */
.sheet .dish-community-sheet,
.sheet .dish-community-sheet *{
  -webkit-tap-highlight-color:transparent;
}

.sheet .dish-community-sheet::before{
  content:none!important;
  display:none!important;
}

.sheet .dish-community-default,
.sheet .dish-note-summary,
.sheet .dish-community-note,
.sheet .dish-community-empty{
  background:#0d2133!important;
  border-color:#2a506b!important;
  color:#dce7ed!important;
  box-shadow:none!important;
}

.sheet .dish-community-default.community-winner{
  background:linear-gradient(145deg,#153b55,#102a3f)!important;
  border-color:rgba(244,122,31,.42)!important;
}

.sheet .dish-note-summary{
  background:#102a3f!important;
}

.sheet .dish-note-summary.quiet,
.sheet .dish-community-empty{
  background:#0a1b2a!important;
}

.sheet .dish-note-theme-list span{
  background:#12304a!important;
  border-color:#315975!important;
  color:#dce7ed!important;
}

.sheet .dish-community-default>b,
.sheet .dish-community-default-head>b,
.sheet .dish-community-note-head b,
.sheet .dish-note-summary-head b,
.sheet .dish-community-note-title b,
.sheet .dish-community-empty b{
  color:#f2f7fa!important;
}

.sheet .dish-community-default p,
.sheet .dish-community-note p{
  color:#dce7ed!important;
}

.sheet .dish-community-default-head span,
.sheet .dish-note-summary-head span,
.sheet .dish-community-note-title span,
.sheet .dish-community-title-row span,
.sheet .dish-community-loading,
.sheet .dish-community-note small,
.sheet .dish-community-empty span,
.sheet .dish-note-summary.quiet span{
  color:#8faabd!important;
}

.sheet .dish-community-sheet h2,
.sheet .dish-community-title-row h2{
  color:var(--ocean-text)!important;
}

.sheet .discussion-modal-text{
  background:#0a1b2a!important;
  border-color:#315975!important;
  color:#f2f7fa!important;
  caret-color:#57b9ff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02)!important;
}

.sheet .discussion-modal-text::placeholder{
  color:#7895aa!important;
}

.sheet .discussion-modal-text:focus{
  background:#0d2133!important;
  border-color:#57b9ff!important;
  box-shadow:0 0 0 3px rgba(87,185,255,.12)!important;
}

.sheet #discussionReplyError:not(:empty),
.sheet #discussionDisagreeError:not(:empty){
  background:#2b1720!important;
  border-color:#70404d!important;
  color:#ffb7c3!important;
}

.discussion-status-pill{
  display:inline-block;
  font-size:9px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.04em;
  padding:2px 6px;
  border-radius:6px;
  background:rgba(234,179,8,0.18);
  color:#fde047;
  border:1px solid rgba(234,179,8,0.35);
  vertical-align:middle;
}
.discussion-status-pill.status-flagged{
  background:rgba(239,68,68,0.18);
  color:#fca5a5;
  border:1px solid rgba(239,68,68,0.35);
}



/* =========================================================
   AC7 real-device iPhone polish — 2026-09-24
   Keep the validated signed-out viewport/safe-area structure intact.
   ========================================================= */

/* Native iOS gives the nav 12px side padding. Center the 52px selection orb
   inside each 58px grid slot instead of using the shared 11px web offset. */
html.deets-native-ios .nav-orb{
  left:15px!important;
}

/* WebKit is more reliable animating transform than the individual translate
   property used by the shared ocean drift. Preserve each letter's rotation. */
html.deets-native-ios .profile-ocean-question span{
  --ocean-angle:0deg;
  animation:ocean-letter-drift-ios-native 5.8s ease-in-out infinite both;
  animation-delay:var(--ocean-float-delay,0s);
  -webkit-animation:ocean-letter-drift-ios-native 5.8s ease-in-out infinite both;
  -webkit-animation-delay:var(--ocean-float-delay,0s);
  transform:rotate(var(--ocean-angle));
  will-change:transform;
}
html.deets-native-ios .profile-ocean-question span:nth-child(1){--ocean-angle:-13deg}
html.deets-native-ios .profile-ocean-question span:nth-child(2){--ocean-angle:8deg}
html.deets-native-ios .profile-ocean-question span:nth-child(3){--ocean-angle:-6deg}
html.deets-native-ios .profile-ocean-question span:nth-child(4){--ocean-angle:7deg}
html.deets-native-ios .profile-ocean-question span:nth-child(5){--ocean-angle:-8deg}
html.deets-native-ios .profile-ocean-question span:nth-child(6){--ocean-angle:6deg}
html.deets-native-ios .profile-ocean-question span:nth-child(7){--ocean-angle:-12deg}
html.deets-native-ios .profile-ocean-question span:nth-child(8){--ocean-angle:8deg}
html.deets-native-ios .profile-ocean-question span:nth-child(9){--ocean-angle:28deg}

@keyframes ocean-letter-drift-ios-native{
  0%,100%{transform:translate3d(0,0,0) rotate(var(--ocean-angle))}
  33%{transform:translate3d(var(--ocean-float-x),calc(0px - var(--ocean-float-y)),0) rotate(var(--ocean-angle))}
  66%{transform:translate3d(calc(0px - var(--ocean-float-x)),var(--ocean-float-y),0) rotate(var(--ocean-angle))}
}

html.deets-native-ios .profile-ocean-eater{
  animation:ocean-eater-drift-ios-native 8.5s ease-in-out infinite;
  -webkit-animation:ocean-eater-drift-ios-native 8.5s ease-in-out infinite;
  will-change:transform;
}
@keyframes ocean-eater-drift-ios-native{
  0%,100%{transform:translate3d(0,0,0)}
  33%{transform:translate3d(4px,-2px,0)}
  66%{transform:translate3d(-3px,3px,0)}
}

/* Keep SIGN IN as the visual anchor, but give it enough motion to feel alive.
   The -8px X offset is the already-validated native visual centering. */
html.deets-native-ios .profile-ocean-signin{
  animation:ios-native-signin-breathe 6s ease-in-out infinite;
  -webkit-animation:ios-native-signin-breathe 6s ease-in-out infinite;
  transform-origin:center;
}
html.deets-native-ios .profile-ocean-signin:active{
  animation-play-state:paused;
  transform:translate3d(-8px,3px,0) rotate(-1.2deg) scale(.99);
}
@keyframes ios-native-signin-breathe{
  0%,100%{transform:translate3d(-8px,0,0) rotate(-1.2deg)}
  50%{transform:translate3d(-8px,-2px,0) rotate(-.8deg)}
}

/* The native keyboard leaves much less useful height. Remove redundant vertical
   bulk from the account sheet while keeping 16px inputs to avoid iOS zoom. */
html.deets-native-ios .auth-shell-simple .auth-panel{
  padding:12px 14px 10px!important;
}
html.deets-native-ios .auth-shell-simple .auth-simple-mark{
  margin-bottom:10px;
  font-size:22px;
}
html.deets-native-ios .auth-shell-simple .auth-tabs{
  gap:4px;
  margin-bottom:8px;
  padding:3px;
  border-radius:11px;
}
html.deets-native-ios .auth-shell-simple .auth-tabs button{
  min-height:35px;
  border-radius:9px;
  padding:6px 8px;
  font-size:11px;
}
html.deets-native-ios .auth-shell-simple .auth-mode-copy{
  display:none;
}
html.deets-native-ios .auth-shell-simple .auth-form{
  gap:6px;
}
html.deets-native-ios .auth-shell-simple .auth-field{
  gap:3px;
}
html.deets-native-ios .auth-shell-simple .auth-field input{
  min-height:42px;
  padding:8px 10px;
  border-radius:10px;
  font-size:16px;
}
html.deets-native-ios .auth-shell-simple .auth-submit{
  min-height:42px;
  margin-top:0;
  padding:8px 10px;
  border-radius:11px;
  font-size:13px;
}
html.deets-native-ios .auth-shell-simple .forgot-password-link{
  min-height:25px;
  padding:3px 8px;
}

/* Successful auth replaces the signed-out YOU DOM in place, so give the new
   profile a short arrival cue even though there was no screen navigation. */
#profile.profile-auth-enter{
  animation:profile-auth-enter 320ms cubic-bezier(.2,0,0,1) both;
}
@keyframes profile-auth-enter{
  from{opacity:0;transform:translate3d(0,10px,0) scale(.99)}
  to{opacity:1;transform:translate3d(0,0,0) scale(1)}
}

@media(prefers-reduced-motion:reduce){
  html.deets-native-ios .profile-ocean-question span,
  html.deets-native-ios .profile-ocean-eater,
  html.deets-native-ios .profile-ocean-signin,
  #profile.profile-auth-enter{
    animation:none!important;
    will-change:auto;
  }
}


/* Native iOS auth sheets track the visual viewport instead of the layout
   viewport so the keyboard cannot cover the account form. The generic modal
   still keeps its existing behavior on web and Android. */
html.deets-native-ios .modal.native-ios-auth{
  inset:auto 0 auto 0!important;
  top:var(--deets-modal-vv-top,0px)!important;
  height:var(--deets-modal-vv-height,100dvh)!important;
  min-height:0!important;
  align-items:center!important;
  padding:
    max(12px,env(safe-area-inset-top,0px))
    12px
    max(12px,env(safe-area-inset-bottom,0px))!important;
}

html.deets-native-ios .modal.native-ios-auth .sheet{
  width:90%!important;
  max-width:350px!important;
  max-height:calc(var(--deets-modal-vv-height,100dvh) - 36px)!important;
  margin:0!important;
  border-radius:20px!important;
  padding-bottom:10px!important;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}


/* 2026-09-26 Eater Buddy meal planning */
#you .eater-meal-plan-card{
  display:grid;
  gap:10px;
  margin-top:10px;
  padding:13px 14px;
  border:1px solid #2a506b;
  border-radius:16px;
  background:#0d2133;
  color:#dce7ed;
  box-shadow:none;
}
#you .eater-meal-plan-card.accepted{
  border-color:#356149;
  background:#10291f;
}
#you .eater-meal-plan-copy{
  display:grid;
  gap:3px;
}
#you .eater-meal-plan-copy>b{
  color:#f2f7fa;
  font-size:13px;
}
#you .eater-meal-plan-copy small{
  color:#9bb4c5;
  font-size:9px;
}
#you .eater-meal-plan-copy p{
  margin:3px 0 0;
  color:#b9cfdd;
  font-size:9px;
  line-height:1.45;
}
#you .eater-meal-plan-actions .eater-meal-plan-primary{
  background:#d9681f!important;
  border-color:#d9681f!important;
  color:#101820!important;
}
.sheet .eater-meal-plan-sheet{
  display:grid;
  gap:12px;
}
.sheet .eater-meal-plan-sheet>p{
  margin:0;
  color:#a7bece;
  font-size:10px;
  line-height:1.5;
}
.sheet .eater-meal-plan-field{
  display:grid;
  gap:6px;
}
.sheet .eater-meal-plan-field>span{
  color:#8faabd;
  font-size:9px;
  font-weight:850;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.sheet .eater-meal-plan-field input{
  width:100%;
  box-sizing:border-box;
  border:1px solid #2a506b;
  border-radius:12px;
  background:#0d2133;
  color:#f2f7fa;
  padding:11px 12px;
  font:inherit;
}
.sheet .eater-meal-plan-selected{
  display:grid;
  gap:2px;
  padding:10px 11px;
  border:1px solid #356149;
  border-radius:12px;
  background:#10291f;
}
.sheet .eater-meal-plan-selected[hidden]{
  display:none;
}
.sheet .eater-meal-plan-selected b{
  color:#f2f7fa;
  font-size:11px;
}
.sheet .eater-meal-plan-selected span{
  color:#a7bece;
  font-size:9px;
}
.sheet .eater-meal-plan-results{
  display:grid;
  gap:6px;
  max-height:220px;
  overflow:auto;
}
.sheet .eater-meal-plan-results>small{
  color:#8faabd;
  font-size:9px;
}
.sheet .eater-meal-plan-results button{
  display:grid;
  gap:2px;
  width:100%;
  text-align:left;
  border:1px solid #23445e;
  border-radius:11px;
  background:#102a3f;
  color:#f2f7fa;
  padding:9px 10px;
}
.sheet .eater-meal-plan-results button span{
  color:#8faabd;
  font-size:9px;
}
.sheet .eater-meal-plan-error{
  min-height:14px;
  color:#ffad8a;
  font-size:9px;
}


/* 2026-09-26 Eater Buddy reservation clarity + casual availability */
#you .eater-meal-plan-reservation-note{
  display:block;
  margin-top:5px;
  color:#ffbf8f!important;
  font-size:8px!important;
  line-height:1.45;
}
#you .eater-meal-availability-card{
  display:grid;
  gap:10px;
  margin-top:10px;
  padding:13px 14px;
  border:1px solid #23445e;
  border-radius:16px;
  background:#0d2133;
}
#you .eater-meal-availability-copy{
  display:grid;
  gap:3px;
}
#you .eater-meal-availability-copy>b{
  color:#f2f7fa;
  font-size:12px;
}
#you .eater-meal-availability-copy p{
  margin:2px 0 0;
  color:#9bb4c5;
  font-size:9px;
  line-height:1.45;
}
#you .eater-meal-availability-times{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
#you .eater-meal-availability-times span{
  padding:5px 8px;
  border:1px solid #315975;
  border-radius:999px;
  background:#12304a;
  color:#dce7ed;
  font-size:8px;
  font-weight:800;
}
#you .eater-meal-availability-card>button{
  justify-self:start;
  border:1px solid #2a506b;
  border-radius:10px;
  background:#102a3f;
  color:#f2f7fa;
  padding:8px 10px;
  font-size:9px;
  font-weight:850;
}
/* 2026-10-10 food preferences ocean theme */
.food-preference-panel{
  background:#0d2133!important;
  border:1px solid #23445e!important;
  border-radius:14px!important;
  color:var(--ocean-text)!important;
}
.food-preference-heading b,
.food-preference-label,
.food-preference-panel label{
  color:var(--ocean-text)!important;
}
.food-preference-heading span,
.food-preference-label span,
.food-preference-panel label>span{
  color:#8faabd!important;
}
.food-preference-panel input[type="text"],
.food-preference-panel input:not([type="checkbox"]):not([type="radio"]):not([type="range"]){
  width:100%!important;
  box-sizing:border-box!important;
  border:1px solid #2a506b!important;
  border-radius:12px!important;
  background:#071927!important;
  color:#f2f7fa!important;
  padding:10px 11px!important;
  font:inherit!important;
}
.food-preference-panel input::placeholder{
  color:#718da1!important;
}
.preference-chip{
  border:1px solid #2a506b!important;
  background:#102a3f!important;
  color:#dce7ed!important;
  border-radius:999px!important;
  padding:7px 9px!important;
  font-size:9px!important;
  font-weight:800!important;
  cursor:pointer;
  transition:.15s ease;
}
.preference-chip:hover{
  background:#153955!important;
  border-color:#3b6b8c!important;
  color:#f2f7fa!important;
}
.preference-chip.active{
  background:var(--ocean-yellow,#ffd84d)!important;
  border-color:var(--ocean-yellow,#ffd84d)!important;
  color:#101820!important;
  font-weight:900!important;
  box-shadow:0 2px 8px rgba(255,216,77,.2)!important;
}
.food-plan-opt-in{
  border:1px solid #23445e!important;
  border-radius:12px!important;
  background:#071927!important;
}
.food-plan-opt-in b{
  color:var(--ocean-text,#f2f7fa)!important;
}
.food-plan-opt-in small{
  color:#8faabd!important;
}
.food-plan-opt-in input[type="checkbox"]{
  accent-color:var(--ocean-food,#ff9a4d)!important;
}
.food-preference-help{
  display:block;
  margin-top:-2px;
  color:#8faabd!important;
  font-size:8px!important;
  line-height:1.45;
}
.sheet .eater-meal-plan-reservation-banner{
  display:grid;
  gap:3px;
  padding:10px 11px;
  border:1px solid rgba(217,104,31,.5);
  border-radius:12px;
  background:#1b2630;
}
.sheet .eater-meal-plan-reservation-banner b{
  color:#ff9a4d;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.sheet .eater-meal-plan-reservation-banner span{
  color:#c8d8e2;
  font-size:9px;
  line-height:1.45;
}


/* 2026-09-26 casual group meals */
.meal-group-size-select,
.meal-preference-mode-select{
  display:grid!important;
  gap:6px!important;
}
.meal-group-size-select select,
.meal-preference-mode-select select,
.sheet .eater-meal-plan-field select{
  width:100%;
  box-sizing:border-box;
  border:1px solid #2a506b;
  border-radius:12px;
  background:#0d2133;
  color:#f2f7fa;
  padding:10px 11px;
  font:inherit;
}
.meal-group-size-select>small,
.meal-preference-mode-select>small,
.sheet .eater-meal-plan-field>small{
  color:#8faabd!important;
  font-size:8px!important;
  line-height:1.4;
}
#you .eater-meal-plan-place{
  color:#f2f7fa;
  font-size:11px;
}
#you .eater-meal-plan-count{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:4px;
}
#you .eater-meal-plan-count b{
  color:#f2f7fa;
  font-size:9px;
}
#you .eater-meal-plan-count span{
  color:#8faabd;
  font-size:8px;
}
#you .eater-meal-plan-people{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  margin-top:2px;
}
#you .eater-meal-plan-people span{
  padding:4px 7px;
  border:1px solid #315975;
  border-radius:999px;
  background:#12304a;
  color:#dce7ed;
  font-size:8px;
}
.sheet .eater-meal-invite-list{
  display:grid;
  gap:8px;
  max-height:320px;
  overflow:auto;
}
.sheet .eater-meal-invite-list .person-result{
  background:#0d2133;
  border-color:#23445e;
}

#you .meal-preference-strength.firm{
  border-color:#7b5a3b!important;
  background:#2b2119!important;
  color:#ffc18c!important;
}

/* Deep Ocean theme: Dish-first search cards */
#home .dish-search-card{
  background:linear-gradient(180deg,rgba(18,48,74,.94),rgba(13,33,51,.98));
  border-color:rgba(87,185,255,.28);
  color:var(--ocean-text);
  box-shadow:0 2px 0 rgba(255,255,255,.015);
}
#home .dish-search-card:hover{
  border-color:rgba(87,185,255,.45);
}
#home .dish-search-card:active{
  transform:scale(.985);
}
#home .dish-search-badge{
  color:#87cfff;
}
#home .dish-search-open{
  color:var(--ocean-text);
}
#home .dish-search-meta{
  color:var(--ocean-muted);
}
#home .dish-search-meta>span+span::before{
  color:#66859b;
}
#home .dish-search-meta .dish-restaurant-name b{
  color:var(--ocean-text);
}
#home .dish-search-meta .restaurant-price{
  color:#87cfff;
}
#home .dish-search-foot{
  border-top-color:rgba(167,190,206,.18);
  color:#8fa9ba;
}
#home .dish-search-card .scorebox{
  background:rgba(244,122,31,.13);
  color:#ffb06f;
  border:1px solid rgba(255,154,77,.28);
}
#home .dish-search-card .scorebox.home-score-good{
  background:#b84f0d;
  border-color:#d9681f;
  color:#fff7ef;
}
#home .dish-search-card .scorebox.home-score-glow,
#home .dish-search-card .scorebox.home-score-five{
  background:#b84f0d;
  border-color:#f47a1f;
  color:#fff7ef;
  box-shadow:0 0 0 2px rgba(244,122,31,.28), 0 0 12px rgba(244,122,31,.45);
}
#home .dish-search-card .scorebox.home-score-unrated{
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.15);
  color:var(--ocean-muted);
  box-shadow:none;
}
.dish-highlight-pulse{
  animation:dishPulse 1.8s ease-out;
}
@keyframes dishPulse{
  0%{box-shadow:0 0 0 0 rgba(244,122,31,.7)}
  50%{box-shadow:0 0 0 8px rgba(244,122,31,.2)}
  100%{box-shadow:none}
}

/* =========================================================
   Homepage Redesign (Deep Ocean Theme):
   Fading words, Search bar, Borough filters, Two Discovery Buttons
   ========================================================= */

.home-persistent-nav{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:8px;
}
.home-persistent-nav .home-search-wrap{
  margin:0;
}
.home-persistent-nav .top-search-row{
  display:flex;
  gap:8px;
  align-items:center;
}
.home-persistent-nav .top-search-row .search{
  flex:1;
  min-width:0;
}
.home-persistent-nav .top-restaurant-add{
  flex-shrink:0;
  width:44px;
  height:44px;
  border-radius:12px;
  border:1px solid rgba(87,185,255,.2);
  background:var(--ocean-surface);
  color:var(--ocean-text);
  font-size:22px;
  font-weight:600;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:background .15s ease, border-color .15s ease;
}
.home-persistent-nav .top-restaurant-add:hover{
  background:rgba(255,255,255,.08);
  border-color:rgba(87,185,255,.45);
}
.home-persistent-nav .home-borough-quick{
  display:flex;
  align-items:center;
  margin:2px -16px 0;
  padding:2px 16px 4px;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.home-persistent-nav .home-borough-quick::-webkit-scrollbar{
  display:none;
}
.home-persistent-nav .home-borough-pills{
  margin-bottom:0;
  gap:6px;
  display:flex;
  flex-wrap:nowrap;
  white-space:nowrap;
  width:max-content;
}
.home-persistent-nav .home-borough-pills button{
  flex-shrink:0;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  padding:7px 12px;
  background:#0d2133;
  border:1px solid #23445e;
  color:#a7bece;
  cursor:pointer;
  transition:all .15s ease;
}
.home-persistent-nav .home-borough-pills button:hover{
  border-color:rgba(87,185,255,.45);
  color:#f2f7fa;
}
.home-persistent-nav .home-borough-pills button.active{
  background:#1a4466;
  border-color:#57b9ff;
  color:#f2f7fa;
  box-shadow:0 0 10px rgba(87,185,255,.2);
}

/* Home Action Bar: Animated Words on LEFT, Filters on RIGHT */
.home-action-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:8px 0 12px;
}
#home .home-action-bar .social-card{
  background:none!important;
  border:none!important;
  box-shadow:none!important;
  padding:0!important;
  margin:0!important;
  flex:1;
  min-width:0;
}
#home .home-action-bar .social-heading{
  height:32px;
  line-height:32px;
  margin:0;
  padding:0;
}
#home .home-action-bar .home-filters-btn{
  flex-shrink:0;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  padding:7px 14px;
  background:#0d2133;
  border:1px solid #23445e;
  color:#a7bece;
  cursor:pointer;
  transition:all .15s ease;
  white-space:nowrap;
}
#home .home-action-bar .home-filters-btn:hover{
  border-color:rgba(87,185,255,.45);
  color:#f2f7fa;
}
#home.search-active .home-action-bar{
  display:none;
}

/* Two Side-by-Side Discovery Buttons */
.home-discovery-buttons{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:10px;
  margin:0 0 16px;
  width:100%;
  box-sizing:border-box;
}
.discovery-btn{
  display:flex;
  align-items:center;
  gap:8px;
  padding:12px 10px;
  min-height:62px;
  min-width:0;
  box-sizing:border-box;
  border-radius:14px;
  border:1px solid rgba(87,185,255,.22);
  background:linear-gradient(180deg,rgba(16,42,63,.92),rgba(13,33,51,.98));
  color:var(--ocean-text);
  cursor:pointer;
  text-align:left;
  -webkit-tap-highlight-color:transparent;
  transition:transform .15s ease,border-color .15s ease,background .15s ease,box-shadow .15s ease;
  box-shadow:0 2px 8px rgba(0,0,0,.15);
}
.discovery-btn:focus:not(:focus-visible){
  outline:none;
}
.discovery-btn:focus-visible{
  outline:2px solid #57b9ff!important;
  outline-offset:2px!important;
  border-color:rgba(87,185,255,.6)!important;
}
.discovery-btn-friends{
  border:1px solid rgba(87,185,255,.22);
}
.discovery-btn:hover{
  border-color:rgba(87,185,255,.45);
  background:linear-gradient(180deg,rgba(20,52,78,.94),rgba(16,40,62,.98));
}
.discovery-btn:active{
  transform:scale(.97);
}
.discovery-btn-icon{
  width:36px;
  height:36px;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.discovery-btn-dish .discovery-btn-icon{
  background:rgba(255,154,77,.16);
  border:1px solid rgba(255,154,77,.28);
  color:#ff9a4d;
}
.discovery-btn-friends .discovery-btn-icon{
  background:rgba(87,185,255,.16);
  border:1px solid rgba(87,185,255,.28);
  color:#87cfff;
}
.discovery-btn-text{
  display:flex;
  flex-direction:column;
  min-width:0;
}
.discovery-btn-text strong{
  font-size:13px;
  font-weight:850;
  line-height:1.25;
  color:var(--ocean-text);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.discovery-btn-text small{
  font-size:11px;
  font-weight:600;
  line-height:1.3;
  color:#8fa9ba;
  margin-top:2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* Hide discovery buttons when actively searching */
#home.search-active .home-fading-words,
#home.search-active .home-discovery-buttons{
  display:none;
}

/* Highlighted Dish Grid: 2 dishes per row */
.highlighted-dish-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
  margin-bottom:24px;
}
.highlighted-dish-card{
  background:var(--ocean-surface);
  border:1px solid var(--ocean-line);
  border-radius:14px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  cursor:pointer;
  transition:transform .15s ease, border-color .15s ease;
  position:relative;
}
.highlighted-dish-card:active{
  transform:scale(.98);
}
.highlighted-dish-photo-wrap{
  position:relative;
  width:100%;
  aspect-ratio:4 / 3;
  background:#06111a;
  overflow:hidden;
}
.highlighted-dish-photo{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.highlighted-dish-fallback{
  width:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  color:#557185;
  background:#081622;
}
.highlighted-dish-fallback img{
  width:32px;
  height:32px;
  opacity:.4;
}
.highlighted-dish-fallback span{
  font-size:10px;
  font-weight:700;
  letter-spacing:.05em;
}
.highlighted-dish-photo-wrap .scorebox{
  position:absolute;
  bottom:6px;
  left:6px;
  margin:0;
}
.highlighted-dish-want{
  position:absolute;
  top:6px;
  right:6px;
  width:32px;
  height:32px;
  border-radius:50%;
  background:rgba(7,21,33,.75);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.15);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:15px;
  cursor:pointer;
  transition:background .15s, color .15s, transform .1s;
  z-index:2;
}
.highlighted-dish-want.active{
  color:#ffd15c;
  border-color:rgba(255,209,92,.4);
  background:rgba(7,21,33,.9);
}
.highlighted-dish-info{
  padding:10px 10px 12px;
  display:flex;
  flex-direction:column;
  gap:3px;
  flex:1;
}
.highlighted-dish-name{
  margin:0;
  font-size:13px;
  font-weight:700;
  line-height:1.25;
}
.highlighted-dish-open{
  background:none;
  border:none;
  padding:0;
  color:#fff;
  font:inherit;
  text-align:left;
  cursor:pointer;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.highlighted-dish-rest{
  margin:0;
  font-size:11px;
  color:#8fa9ba;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* Pick a Dish Modal */
.pick-dish-modal{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.pick-dish-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  padding-right:38px;
}
.pick-dish-header-copy{
  display:flex;
  flex-direction:column;
  min-width:0;
  flex:1;
}
.pick-dish-rotator{
  position:relative;
  height:26px;
  line-height:26px;
  margin:0;
  padding:0;
  overflow:hidden;
  min-width:170px;
}
.pick-dish-rotator-accessible{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
}
.pick-dish-phrase{
  position:absolute;
  left:0;
  top:0;
  width:100%;
  white-space:nowrap;
  font-size:18px;
  font-weight:850;
  letter-spacing:-0.02em;
  color:#f2f7fa;
  opacity:0;
  animation:pick-dish-phrase-crossfade 14s linear infinite;
  animation-delay:calc(var(--pick-dish-index) * 3.5s);
}
@keyframes pick-dish-phrase-crossfade{
  0%{opacity:0}
  2.8%,22.2%{opacity:1}
  25%,100%{opacity:0}
}
#modal:not(.show) .pick-dish-phrase{
  animation-play-state:paused;
}
@media (prefers-reduced-motion: reduce){
  .pick-dish-phrase{
    animation:none!important;
    opacity:0;
  }
  .pick-dish-phrase:first-of-type{
    opacity:1;
  }
}
.pick-dish-dist-pill{
  font-size:10px;
  font-weight:800;
  padding:4px 8px;
  border-radius:999px;
  background:#102a3f;
  border:1px solid #2a506b;
  color:#87cfff;
  white-space:nowrap;
  flex-shrink:0;
  align-self:flex-start;
}
.pick-dish-card-body{
  display:flex;
  flex-direction:column;
  gap:12px;
  background:#0d2133;
  border:1px solid #23445e;
  border-radius:18px;
  padding:14px;
}
.pick-dish-photo-container{
  position:relative;
  width:100%;
  height:200px;
  border-radius:14px;
  overflow:hidden;
  background:#071927;
}
.pick-dish-photo{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.pick-dish-fallback-photo{
  width:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:linear-gradient(135deg,#0a1e30,#143550);
  color:#8faabd;
  font-size:10px;
  font-weight:850;
  letter-spacing:.06em;
}
.pick-dish-fallback-photo img{
  width:42px;
  height:42px;
  opacity:.75;
}
.pick-dish-scorebox{
  position:absolute;
  top:10px;
  right:10px;
  width:48px;
  height:48px;
  border-radius:50%;
  display:grid;
  align-content:center;
  justify-items:center;
  gap:2px;
  background:rgba(244,122,31,.13);
  color:#ffb06f;
  border:1px solid rgba(255,154,77,.28);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}
.pick-dish-scorebox b{
  font-size:17px;
  font-weight:900;
  line-height:1;
}
.pick-dish-scorebox span{
  font-size:7px;
  font-weight:850;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.pick-dish-scorebox.home-score-good{
  background:#b84f0d;
  border-color:#d9681f;
  color:#fff7ef;
}
.pick-dish-scorebox.home-score-glow{
  background:#b84f0d;
  border-color:#f47a1f;
  color:#fff7ef;
  box-shadow:0 0 0 2px rgba(244,122,31,.28), 0 0 12px rgba(244,122,31,.45);
}
.pick-dish-info{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.pick-dish-title{
  margin:0;
  font-size:19px;
  font-weight:900;
  letter-spacing:-.02em;
  color:var(--ocean-text);
  line-height:1.25;
}
.pick-dish-restaurant-btn{
  background:none;
  border:0;
  padding:0;
  text-align:left;
  cursor:pointer;
  display:flex;
  flex-direction:column;
  gap:2px;
  color:inherit;
}
.pick-dish-restaurant-btn strong{
  font-size:14px;
  color:#87cfff;
  font-weight:850;
}
.pick-dish-restaurant-btn span{
  font-size:11px;
  color:#8fa9ba;
}
.pick-dish-actions-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:4px;
}
.pick-dish-another-action{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  background:#1a4466;
  border:1px solid #57b9ff;
  color:#f2f7fa;
  border-radius:12px;
  padding:11px;
  font-size:12px;
  font-weight:850;
  cursor:pointer;
  transition:all .15s ease;
}
.pick-dish-another-action:hover{
  background:#20527b;
}
.pick-dish-another-action:active{
  transform:scale(.97);
}
.pick-dish-want-action{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  background:#102a3f;
  border:1px solid #2a506b;
  color:#8fa9ba;
  border-radius:12px;
  padding:11px;
  font-size:12px;
  font-weight:850;
  cursor:pointer;
  transition:all .15s ease;
}
.pick-dish-want-action.active{
  border-color:rgba(255,154,77,.55);
  background:rgba(255,154,77,.18);
  color:#ffb06f;
}
.pick-dish-footer button{
  width:100%;
}
.pick-dish-neighborhood-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:8px;
  margin:12px 0;
}
.pick-dish-area-btn{
  background:#102a3f;
  border:1px solid #2a506b;
  color:#f2f7fa;
  border-radius:12px;
  padding:10px;
  font-size:11px;
  font-weight:800;
  cursor:pointer;
  text-align:center;
  transition:all .15s ease;
}
.pick-dish-area-btn:hover{
  border-color:#57b9ff;
  background:#173b57;
}
.pick-dish-empty-actions{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin:12px 0;
}

/* Friends Activity Modal */
.friends-modal{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.friends-modal-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
}
.friends-modal-head-actions{
  display:inline-flex;
  align-items:center;
  gap:8px;
  flex-shrink:0;
  margin-top:2px;
}
.friends-find-link{
  font-size:11px;
  font-weight:850;
  padding:6px 12px;
  border-radius:999px;
  background:#102a3f;
  border:1px solid #2a506b;
  color:#87cfff;
  cursor:pointer;
  transition:all .15s ease;
  white-space:nowrap;
}
.friends-find-link:hover{
  border-color:#57b9ff;
  background:#173b57;
  color:#f2f7fa;
}
.friends-head-close{
  background:none;
  border:none;
  color:#87a1b3;
  font-size:22px;
  line-height:1;
  cursor:pointer;
  padding:2px 4px;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:color .15s ease;
}
.friends-head-close:hover{
  color:#f2f7fa;
}
#modalSheet:has(.friends-modal) > #modalX{
  display:none !important;
}
.friends-empty-card{
  background:#0d2133;
  border:1px solid #23445e;
  border-radius:16px;
  padding:18px;
  text-align:center;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.friends-empty-card p{
  margin:0;
  font-size:13px;
  line-height:1.45;
  color:#8fa9ba;
}
.friends-empty-actions{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.friends-activity-feed{
  display:flex;
  flex-direction:column;
  gap:10px;
  max-height:60vh;
  overflow-y:auto;
  padding-right:2px;
}
.friends-feed-item{
  background:#0d2133;
  border:1px solid #23445e;
  border-radius:14px;
  padding:12px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.friends-feed-user-bar{
  display:flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
}
.friends-feed-user-meta{
  display:flex;
  flex-direction:column;
  min-width:0;
}
.friends-feed-user-meta b{
  font-size:12px;
  color:#f2f7fa;
  font-weight:850;
}
.friends-feed-user-meta span{
  font-size:10px;
  color:#8fa9ba;
}
.friends-feed-card{
  background:#071927;
  border:1px solid #1a3850;
  border-radius:10px;
  padding:10px 12px;
  cursor:pointer;
  text-align:left;
  display:flex;
  flex-direction:column;
  gap:6px;
  color:inherit;
  width:100%;
  box-sizing:border-box;
  transition:border-color .15s ease;
}
.friends-feed-card:hover{
  border-color:#57b9ff;
}
.friends-feed-card-header{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:8px;
}
.friends-feed-card-header strong{
  font-size:13px;
  color:#f2f7fa;
}
.friends-feed-card-header span{
  font-size:10px;
  color:#8fa9ba;
  white-space:nowrap;
}
.friends-feed-dishes{
  display:flex;
  flex-wrap:wrap;
  gap:4px;
}
.friends-dish-pill{
  font-size:10px;
  padding:3px 7px;
  border-radius:6px;
  background:#102a3f;
  color:#dce7ed;
  display:inline-flex;
  align-items:center;
  gap:4px;
}
.friends-dish-pill b{
  color:#ff9a4d;
  font-weight:900;
}
.friends-feed-note{
  font-size:10px;
  color:#8fa9ba;
  font-style:italic;
}

/* =========================================================
   Find People & People You Follow (Deep Ocean Theme)
   ========================================================= */

.people-browser{
  color:var(--ocean-text);
}

.people-browser-intro{
  color:#8faabd!important;
}

.people-browser-tabs{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:4px!important;
  padding:4px!important;
  margin:10px 0 12px!important;
  border-radius:14px!important;
  background:#0d2133!important;
  border:1px solid #23445e!important;
}

.people-browser-tabs button{
  min-height:38px!important;
  border:0!important;
  border-radius:10px!important;
  background:transparent!important;
  color:#8faabd!important;
  font-size:11px!important;
  font-weight:700!important;
  cursor:pointer!important;
  transition:all .15s ease!important;
}

.people-browser-tabs button:hover{
  color:#f2f7fa!important;
}

.people-browser-tabs button.active{
  background:#1a4466!important;
  border:1px solid #57b9ff!important;
  color:#f2f7fa!important;
  box-shadow:0 0 10px rgba(87,185,255,.2)!important;
}

.people-search-row{
  margin:0 0 12px!important;
}

.people-search-row .mini-search{
  width:100%!important;
  min-height:44px!important;
  border-radius:13px!important;
  padding:10px 14px!important;
  background:#0d2133!important;
  border:1px solid #23445e!important;
  color:#f2f7fa!important;
  caret-color:#57b9ff!important;
  font-size:15px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}

.people-search-row .mini-search::placeholder{
  color:#718da1!important;
}

.people-search-row .mini-search:focus{
  border-color:#57b9ff!important;
  outline:none!important;
  box-shadow:0 0 8px rgba(87,185,255,.25)!important;
}

.people-results{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:8px!important;
  max-height:55vh!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding-right:2px!important;
}

.person-result{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  min-height:56px!important;
  gap:10px!important;
  border:1px solid #23445e!important;
  border-radius:14px!important;
  padding:9px 12px!important;
  background:linear-gradient(180deg,#10283b,#0d2133)!important;
  color:var(--ocean-text)!important;
  box-shadow:none!important;
  box-sizing:border-box!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
}

.person-result:hover{
  border-color:rgba(87,185,255,.45)!important;
}

.person-result:active{
  transform:scale(.99)!important;
}

.person-result-text{
  flex:1 1 auto!important;
  min-width:0!important;
  overflow:hidden!important;
}

.person-result-text b,
.person-result-text span,
.person-result-text small{
  display:block!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  max-width:100%!important;
}

.person-result-text b{
  color:#f2f7fa!important;
  font-size:13px!important;
  line-height:1.25!important;
}

.person-result-text span{
  color:#8faabd!important;
  font-size:10px!important;
  margin-top:2px!important;
}

.person-result-text small{
  color:#a7bece!important;
  font-size:10px!important;
  margin-top:3px!important;
}

.person-result .profile-avatar{
  width:40px!important;
  height:40px!important;
  font-size:16px!important;
  flex:0 0 40px!important;
  border-radius:50%!important;
  background:#163652!important;
  color:#ffd84d!important;
  border:1px solid #2a506b!important;
}

.public-profile-head .profile-avatar{
  background:#163652!important;
  color:#ffd84d!important;
  border:1px solid #2a506b!important;
}

.mini-follow{
  flex:0 0 auto!important;
}

.mini-follow:not(.following),
.follow-btn:not(.following){
  background:#ff9a4d!important;
  color:#071521!important;
  border:1px solid transparent!important;
  font-weight:800!important;
  border-radius:999px!important;
  cursor:pointer!important;
  transition:all .15s ease!important;
}

.mini-follow:not(.following):hover,
.follow-btn:not(.following):hover{
  background:#ffa764!important;
}

.mini-follow.following,
.follow-btn.following{
  background:#102a3f!important;
  border:1px solid #23445e!important;
  color:#8faabd!important;
  box-shadow:none!important;
  border-radius:999px!important;
  cursor:pointer!important;
  transition:all .15s ease!important;
}

.mini-follow.following:hover,
.follow-btn.following:hover{
  border-color:rgba(87,185,255,.45)!important;
  color:#f2f7fa!important;
}

.person-you{
  background:#12304a!important;
  border:1px solid #23445e!important;
  color:#8faabd!important;
  font-size:9px!important;
  font-weight:800!important;
  padding:4px 8px!important;
  border-radius:999px!important;
}

.people-empty{
  display:grid!important;
  gap:4px!important;
  padding:16px!important;
  border:1px dashed #23445e!important;
  border-radius:14px!important;
  background:#0d2133!important;
  color:var(--ocean-text)!important;
}

.people-empty b{
  font-size:12px!important;
  color:#f2f7fa!important;
}

.people-empty span{
  color:#8faabd!important;
  font-size:10px!important;
  line-height:1.45!important;
}

.people-results .loading-card{
  background:#0d2133!important;
  border:1px solid #23445e!important;
  color:#8faabd!important;
  border-radius:14px!important;
  padding:14px!important;
}

.public-profile-stats>div,
.public-profile-stats>.public-stat-button{
  background:#0d2133!important;
  border:1px solid #23445e!important;
  color:#f2f7fa!important;
  border-radius:14px!important;
}

.public-profile-stats b{
  color:#ff9a4d!important;
}

.public-profile-stats span{
  color:#8faabd!important;
}

.public-profile-actions .profile-more-btn{
  background:#102a3f!important;
  border:1px solid #23445e!important;
  color:#f2f7fa!important;
}

.public-review-card,
.public-photo-groups .profile-photo-card,
.public-guide-list .guide-card{
  background:#0d2133!important;
  border:1px solid #23445e!important;
  color:#f2f7fa!important;
  border-radius:14px!important;
}

/* Modal close button in sheets */
.sheet-actions button.light,
.sheet-actions #peopleClose,
.sheet-actions #followerListClose{
  background:#102a3f!important;
  border:1px solid #23445e!important;
  color:#f2f7fa!important;
}

.sheet-actions button.light:hover,
.sheet-actions #peopleClose:hover,
.sheet-actions #followerListClose:hover{
  border-color:rgba(87,185,255,.4)!important;
}


/* =========================================================
   YOUR LISTS: Restored approved layout & Deep Ocean styling
   ========================================================= */

/* YOU Page: Action button colors (Edit profile, Share profile, Want to Go) */
#you #editProfile,
#you #shareProfile,
#you #wantOpen{
  background:#FFF0DC!important;
  color:#101820!important;
  border:1px solid rgba(16,24,32,.12)!important;
  font-weight:750!important;
}

#you #editProfile:hover,
#you #shareProfile:hover,
#you #wantOpen:hover{
  background:#ffe8cb!important;
  color:#101820!important;
}

#you #editProfile:active,
#you #shareProfile:active,
#you #wantOpen:active{
  transform:scale(.98)!important;
}

#guides .guide-empty{
  padding:14px 16px!important;
  border-radius:14px!important;
  background:linear-gradient(180deg,#10283b,#0d2133)!important;
  border:1px dashed #23445e!important;
}

#guides .guide-empty b{
  font-size:13px!important;
  color:#f2f7fa!important;
}

#guides .guide-empty span{
  font-size:10px!important;
  color:#8faabd!important;
  line-height:1.45!important;
}

/* ==========================================================================
   MONTHLY FOOD FACE-OFF
   ========================================================================== */

.map-face-off-card{
  margin:12px 14px 10px;
  padding:12px 16px;
  background:linear-gradient(135deg,rgba(13,33,51,.96),rgba(18,48,74,.93));
  border:1px solid rgba(87,185,255,.24);
  border-radius:14px;
  box-shadow:0 6px 20px rgba(0,0,0,.35),0 0 14px rgba(87,185,255,.08);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  cursor:pointer;
  transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease;
}
.map-face-off-card:hover{
  transform:translateY(-1px);
  border-color:rgba(87,185,255,.45);
  box-shadow:0 8px 24px rgba(0,0,0,.4),0 0 18px rgba(87,185,255,.14);
}
.map-faceoff-content{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}
.map-faceoff-eyebrow{
  color:var(--ocean-yellow);
  font-size:10px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.map-faceoff-title{
  font-size:13px;
  font-weight:700;
  color:#fff;
  line-height:1.25;
}
.map-faceoff-sub{
  font-size:11px;
  color:var(--ocean-muted);
}
.map-faceoff-btn{
  background:rgba(87,185,255,.18);
  color:#57b9ff;
  border:1px solid rgba(87,185,255,.35);
  border-radius:20px;
  font-size:11px;
  font-weight:700;
  padding:6px 14px;
  white-space:nowrap;
  flex-shrink:0;
  pointer-events:none;
}

/* Map marker for faceoff competing spots */
.map-marker.faceoff-marker{
  background:linear-gradient(135deg,#ffd84d,#ff9a4d);
  color:#071521;
  font-weight:900;
  font-size:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  box-shadow:0 0 14px rgba(255,216,77,.5),0 2px 6px rgba(0,0,0,.4);
  border:2px solid #fff;
}

/* Face-Off Screen Shell */
#faceoff.screen{
  padding-bottom:80px;
}
#faceoff .topbar{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 16px;
  background:rgba(7,21,33,.95);
  border-bottom:1px solid var(--ocean-line);
  position:sticky;
  top:0;
  z-index:20;
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
}
#faceoff .topbar h2{
  font-size:16px;
  font-weight:700;
  color:#fff;
  margin:0;
}
.faceoff-shell{
  padding:16px;
  max-width:680px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  gap:18px;
}

.faceoff-header{
  background:var(--ocean-surface);
  border:1px solid var(--ocean-line);
  border-radius:16px;
  padding:18px 20px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.faceoff-header h2{
  font-size:22px;
  font-weight:800;
  color:#fff;
  line-height:1.2;
  margin:2px 0;
}
.faceoff-tags{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:center;
  margin:4px 0;
}
.faceoff-tag{
  font-size:11px;
  font-weight:600;
  padding:3px 9px;
  border-radius:20px;
  background:var(--ocean-surface-2);
  border:1px solid var(--ocean-line);
  color:var(--ocean-text);
}
.faceoff-phase-pill{
  font-size:11px;
  font-weight:700;
  padding:3px 10px;
  border-radius:20px;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.faceoff-phase-pill.claiming{
  background:rgba(87,185,255,.18);
  color:#57b9ff;
  border:1px solid rgba(87,185,255,.32);
}
.faceoff-phase-pill.tasting{
  background:rgba(255,216,77,.18);
  color:#ffd84d;
  border:1px solid rgba(255,216,77,.35);
}
.faceoff-phase-pill.completed{
  background:rgba(85,201,149,.18);
  color:#55c995;
  border:1px solid rgba(85,201,149,.35);
}
.faceoff-phase-pill.inconclusive{
  background:rgba(167,190,206,.15);
  color:#a7bece;
  border:1px solid rgba(167,190,206,.25);
}
.faceoff-phase-pill.voting{
  background:rgba(167,139,250,.18);
  color:#c4b5fd;
  border:1px solid rgba(167,139,250,.3);
}
.faceoff-description{
  font-size:13px;
  color:var(--ocean-muted);
  line-height:1.5;
  margin:4px 0 0;
}
.faceoff-guidance{
  font-size:12px;
  background:rgba(7,21,33,.6);
  border-radius:8px;
  padding:8px 12px;
  color:var(--ocean-text);
  border-left:3px solid var(--ocean-blue);
}
.faceoff-deadline-bar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  font-size:12px;
  color:var(--ocean-muted);
  margin-top:8px;
  padding-top:10px;
  border-top:1px solid rgba(255,255,255,.06);
}
.faceoff-chain-unlocked-pill{
  font-size:10px;
  font-weight:700;
  padding:3px 8px;
  border-radius:12px;
  background:rgba(255,154,77,.18);
  color:#ff9a4d;
  border:1px solid rgba(255,154,77,.35);
}

/* Winner Banner */
.faceoff-winner-banner{
  background:linear-gradient(135deg,rgba(255,216,77,.15),rgba(244,122,31,.12));
  border:1px solid rgba(255,216,77,.4);
  border-radius:16px;
  padding:16px 20px;
  display:flex;
  align-items:center;
  gap:16px;
  box-shadow:0 6px 24px rgba(255,216,77,.12);
}
.faceoff-winner-trophy{
  font-size:36px;
  flex-shrink:0;
  filter:drop-shadow(0 2px 8px rgba(255,216,77,.4));
}
.faceoff-winner-banner h3{
  font-size:18px;
  font-weight:800;
  color:#fff;
  margin:2px 0;
}
.faceoff-winner-banner p{
  font-size:12px;
  color:var(--ocean-muted);
  margin:2px 0 0;
}

/* Champion nomination banner */
.faceoff-champ-nomination-card{
  background:linear-gradient(135deg,rgba(167,139,250,.18),rgba(87,185,255,.14));
  border:1px solid rgba(167,139,250,.4);
  border-radius:16px;
  padding:16px 20px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.faceoff-champ-nomination-card h3{
  font-size:16px;
  font-weight:700;
  color:#fff;
  margin:0;
}
.faceoff-champ-nomination-card p{
  font-size:12px;
  color:var(--ocean-muted);
  line-height:1.45;
  margin:0;
}

/* Spots Grid & Cards */
.faceoff-spots-section{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.faceoff-spots-head{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.faceoff-spots-head h3{
  font-size:16px;
  font-weight:700;
  color:#fff;
  margin:0;
}
.faceoff-spots-head small{
  font-size:12px;
  color:var(--ocean-muted);
}
.faceoff-spots-grid{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.faceoff-spot-card.claimed{
  background:var(--ocean-surface);
  border:1px solid var(--ocean-line);
  border-radius:14px;
  padding:16px 18px;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.faceoff-spot-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
}
.faceoff-spot-name{
  font-size:17px;
  font-weight:700;
  color:#fff;
  margin:4px 0 2px;
  cursor:pointer;
  transition:color .12s ease;
}
.faceoff-spot-name:hover{
  color:var(--ocean-blue);
}
.faceoff-spot-meta{
  font-size:12px;
  color:var(--ocean-muted);
}
.faceoff-slot-pill{
  font-size:10px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--ocean-blue);
  background:rgba(87,185,255,.12);
  padding:2px 8px;
  border-radius:6px;
}
.faceoff-deets-badge{
  font-size:10px;
  font-weight:700;
  color:#ffd84d;
  background:rgba(255,216,77,.12);
  padding:2px 6px;
  border-radius:4px;
}
.faceoff-rank-badge{
  font-size:12px;
  font-weight:800;
  padding:2px 8px;
  border-radius:6px;
  background:rgba(255,255,255,.1);
  color:#fff;
}
.faceoff-rank-badge.rank-1{
  background:linear-gradient(135deg,#ffd84d,#f47a1f);
  color:#071521;
  box-shadow:0 0 12px rgba(255,216,77,.4);
}
.faceoff-spot-score{
  display:flex;
  flex-direction:column;
  align-items:center;
  background:rgba(7,21,33,.8);
  border:1px solid var(--ocean-line);
  border-radius:10px;
  padding:6px 10px;
}
.faceoff-spot-score b{
  font-size:18px;
  font-weight:800;
  color:var(--ocean-yellow);
}
.faceoff-spot-score small{
  font-size:9px;
  font-weight:700;
  color:var(--ocean-muted);
  letter-spacing:.05em;
}

.faceoff-spot-dishes{
  background:rgba(7,21,33,.6);
  border-radius:10px;
  padding:10px 14px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.faceoff-dishes-title{
  font-size:10px;
  font-weight:700;
  color:var(--ocean-muted);
  letter-spacing:.06em;
}
.faceoff-dish-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:6px 0;
  border-bottom:1px solid rgba(255,255,255,.04);
}
.faceoff-dish-row:last-child{
  border-bottom:none;
}
.faceoff-dish-info{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
}
.faceoff-dish-info b{
  font-size:13px;
  color:#fff;
}
.dish-qual-pill{
  font-size:10px;
  font-weight:600;
  padding:2px 7px;
  border-radius:6px;
}
.dish-qual-pill.qualified{
  background:rgba(85,201,149,.16);
  color:#55c995;
  border:1px solid rgba(85,201,149,.3);
}
.dish-qual-pill.pending{
  background:rgba(255,216,77,.14);
  color:#ffd84d;
  border:1px solid rgba(255,216,77,.28);
}
.dish-qual-pill.score{
  background:rgba(87,185,255,.16);
  color:#57b9ff;
  font-weight:700;
}
.dish-qual-pill.unranked{
  background:rgba(167,190,206,.12);
  color:#a7bece;
}
.mini-rate-btn{
  background:var(--ocean-blue);
  color:#071521;
  font-size:11px;
  font-weight:700;
  border:none;
  border-radius:14px;
  padding:4px 12px;
  cursor:pointer;
  transition:opacity .15s ease,transform .15s ease;
}
.mini-rate-btn:hover{
  opacity:.9;
}
.mini-rate-btn:active{
  transform:scale(.96);
}

.faceoff-spot-foot{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-top:2px;
}
.faceoff-owner-actions{
  display:flex;
  gap:6px;
}

/* Vacant Spot Card */
.faceoff-spot-card.vacant{
  background:rgba(13,33,51,.45);
  border:2px dashed rgba(87,185,255,.25);
  border-radius:14px;
  padding:18px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.faceoff-vacant-head{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.faceoff-vacant-head h4{
  font-size:15px;
  font-weight:700;
  color:#fff;
  margin:2px 0 0;
}
.faceoff-vacant-head p{
  font-size:12px;
  color:var(--ocean-muted);
  margin:0;
}
.faceoff-claim-btn{
  font-size:12px;
  padding:8px 16px;
  white-space:nowrap;
  flex-shrink:0;
}
.faceoff-closed-note{
  font-size:11px;
  color:var(--ocean-muted);
}

/* Community Ballot / Poll */
.faceoff-poll-section{
  background:var(--ocean-surface);
  border:1px solid var(--ocean-line);
  border-radius:16px;
  padding:18px 20px;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.faceoff-poll-section h3{
  font-size:17px;
  font-weight:700;
  color:#fff;
  margin:0;
}
.faceoff-poll-section p{
  font-size:12px;
  color:var(--ocean-muted);
  margin:0;
  line-height:1.45;
}
.faceoff-poll-options{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.faceoff-poll-opt{
  background:var(--ocean-surface-2);
  border:1px solid var(--ocean-line);
  border-radius:12px;
  padding:12px 14px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  transition:border-color .15s ease,background .15s ease;
}
.faceoff-poll-opt.voted{
  border-color:rgba(87,185,255,.6);
  background:rgba(87,185,255,.08);
}
.faceoff-poll-opt-main{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.faceoff-poll-opt-main b{
  font-size:13px;
  color:#fff;
}
.faceoff-poll-opt-main p{
  font-size:11px;
  color:var(--ocean-muted);
  margin:0;
}
.champ-nom-pill{
  font-size:9px;
  font-weight:700;
  color:#ffd84d;
  background:rgba(255,216,77,.12);
  padding:2px 6px;
  border-radius:4px;
  width:fit-content;
}
.poll-vote-btn{
  background:rgba(255,255,255,.08);
  color:#fff;
  border:1px solid var(--ocean-line);
  border-radius:20px;
  padding:6px 16px;
  font-size:12px;
  font-weight:600;
  cursor:pointer;
  transition:all .15s ease;
  flex-shrink:0;
}
.poll-vote-btn.active{
  background:var(--ocean-blue);
  color:#071521;
  border-color:var(--ocean-blue);
}

/* Dish Selector List in Claim Modal */
.faceoff-dish-select-list{
  max-height:260px;
  overflow-y:auto;
  display:flex;
  flex-direction:column;
  gap:8px;
  margin:12px 0;
  padding:2px;
}
.faceoff-dish-pick-item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:10px;
  background:var(--ocean-surface-2);
  border:1px solid var(--ocean-line);
  cursor:pointer;
  font-size:13px;
  color:var(--ocean-text);
  transition:background .15s ease;
}
.faceoff-dish-pick-item:hover{
  background:rgba(87,185,255,.1);
}
.faceoff-dish-pick-item input[type="checkbox"]{
  accent-color:var(--ocean-blue);
  width:18px;
  height:18px;
}

/* ==========================================================================
   TROPHY CASE (PROFILE & PUBLIC PROFILE)
   ========================================================================== */

.profile-trophy-case{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:12px;
  margin-bottom:20px;
}
.profile-trophy-card{
  background:linear-gradient(135deg,rgba(18,48,74,.9),rgba(13,33,51,.96));
  border:1px solid rgba(255,216,77,.35);
  border-radius:14px;
  padding:14px 16px;
  display:flex;
  align-items:center;
  gap:14px;
  box-shadow:0 4px 16px rgba(0,0,0,.25),0 0 12px rgba(255,216,77,.08);
  cursor:pointer;
  transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease;
}
.profile-trophy-card:hover{
  transform:translateY(-2px);
  border-color:rgba(255,216,77,.65);
  box-shadow:0 8px 24px rgba(0,0,0,.35),0 0 18px rgba(255,216,77,.18);
}
.trophy-badge{
  font-size:34px;
  flex-shrink:0;
  filter:drop-shadow(0 2px 8px rgba(255,216,77,.4));
}
.trophy-artwork-placeholder{
  font-size:11px;
  font-style:italic;
  color:var(--ocean-yellow,#ffd84d);
  background:rgba(255,216,77,.08);
  border:1px dashed rgba(255,216,77,.35);
  border-radius:8px;
  padding:6px 10px;
  text-align:center;
  line-height:1.35;
  flex-shrink:0;
}
.trophy-details{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}
.trophy-kicker{
  font-size:10px;
  font-weight:700;
  text-transform:uppercase;
  color:var(--ocean-yellow);
  letter-spacing:.05em;
}
.trophy-title{
  font-size:14px;
  font-weight:700;
  color:#fff;
  margin:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.trophy-restaurant{
  font-size:13px;
  color:var(--ocean-blue);
  margin-top:1px;
}
.trophy-score{
  font-size:11px;
  color:var(--ocean-muted);
  margin-top:2px;
}
.trophy-score strong{
  color:#fff;
  font-size:12px;
}
.profile-trophy-empty{
  padding:14px 16px;
  border-radius:12px;
  background:rgba(13,33,51,.5);
  border:1px dashed var(--ocean-line);
  color:var(--ocean-muted);
  font-size:13px;
  margin-bottom:20px;
  text-align:center;
}

/* Lists Screen: Hero Banner Branding and Contained New List Button */
#guides .guides-hero .guides-hero-brand{
  position:absolute!important;
  left:16px!important;
  top:14px!important;
  z-index:3!important;
  font-size:18px!important;
  font-weight:900!important;
  letter-spacing:-0.02em!important;
  color:#f2f7fa!important;
}
#guides .guides-hero .guides-hero-brand span{
  color:var(--ocean-primary, #f59e0b)!important;
}
#guides .guides-hero .hero-new-guide{
  position:absolute!important;
  bottom:14px!important;
  right:14px!important;
  top:auto!important;
  left:auto!important;
  z-index:3!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:8px 16px!important;
  border-radius:999px!important;
  background:var(--ocean-primary, #f59e0b)!important;
  color:#061521!important;
  font-size:12px!important;
  font-weight:850!important;
  border:none!important;
  box-shadow:0 4px 14px rgba(0,0,0,.35)!important;
  cursor:pointer!important;
  transition:transform .15s ease, background .15s ease!important;
  width:auto!important;
  min-height:auto!important;
  white-space:nowrap;
}
#guides .guides-hero .hero-new-guide:hover{
  transform:translateY(-1px)!important;
}
#guides .guides-hero .hero-new-guide:active{
  transform:scale(.97)!important;
}

/* Two Random Featured Dishes with Rotating Text Heading */
.featured-dishes-section{
  margin:0 0 20px;
}
#home.search-active .featured-dishes-section{
  display:none;
}
.featured-heading-wrap{
  margin:0 0 10px;
}
.featured-heading{
  position:relative;
  height:28px;
  line-height:28px;
  margin:0;
  padding:0;
  overflow:hidden;
}
.featured-heading-accessible{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
}
.featured-heading-phrase{
  position:absolute;
  left:0;
  top:0;
  width:100%;
  white-space:nowrap;
  font-size:17px;
  font-weight:850;
  letter-spacing:-0.01em;
  color:#f2f7fa;
  opacity:0;
  animation:featured-heading-crossfade 17.5s linear infinite;
  animation-delay:calc(var(--featured-heading-index) * 3.5s);
}
@keyframes featured-heading-crossfade{
  0%{opacity:0}
  2.3%,17.7%{opacity:1}
  20%,100%{opacity:0}
}
.screen:not(.active) .featured-heading-phrase,
#home:not(.active) .featured-heading-phrase{
  animation-play-state:paused;
}
@media (prefers-reduced-motion: reduce){
  .featured-heading-phrase{
    animation:none!important;
    opacity:0;
  }
  .featured-heading-phrase:first-of-type{
    opacity:1;
  }
}

.featured-dishes-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:12px;
  width:100%;
  box-sizing:border-box;
}
.featured-dish-card{
  background:#0d2133;
  border:1px solid #1c3d5a;
  border-radius:16px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  cursor:pointer;
  transition:transform .15s ease, border-color .15s ease, box-shadow .15s ease;
  position:relative;
}
.featured-dish-card:hover{
  border-color:rgba(87,185,255,.4);
  transform:translateY(-1px);
  box-shadow:0 6px 20px rgba(0,0,0,.3);
}
.featured-dish-card:active{
  transform:scale(.985);
}
.featured-dish-photo-wrap{
  position:relative;
  width:100%;
  aspect-ratio:4 / 3;
  background:#071521;
  overflow:hidden;
}
.featured-dish-photo{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .3s ease;
}
.featured-dish-card:hover .featured-dish-photo{
  transform:scale(1.03);
}
.featured-dish-fallback{
  width:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  background:#091d2d;
  color:#57b9ff;
  font-size:10px;
  font-weight:800;
  letter-spacing:0.04em;
}
.featured-dish-fallback img{
  width:32px;
  height:32px;
  opacity:0.65;
}
.featured-dish-body{
  padding:10px;
  display:flex;
  flex-direction:column;
  gap:3px;
  flex:1;
}
.featured-dish-title{
  font-size:14px;
  font-weight:800;
  color:#f2f7fa;
  line-height:1.25;
  margin:0;
  overflow:hidden;
  text-overflow:ellipsis;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}
.featured-dish-sub{
  font-size:11px;
  color:#82a3ba;
  line-height:1.3;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.featured-dish-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:auto;
  padding-top:6px;
}
.featured-dish-score{
  font-size:11px;
  font-weight:800;
  padding:2px 7px;
  border-radius:6px;
  background:rgba(87,185,255,.14);
  color:#57b9ff;
  display:inline-flex;
  align-items:center;
  gap:3px;
}
.featured-dish-score.score-glow{
  background:rgba(245,158,11,.15);
  color:#f59e0b;
}
.featured-dish-want{
  background:none;
  border:none;
  font-size:17px;
  line-height:1;
  color:#82a3ba;
  padding:4px 6px;
  border-radius:6px;
  cursor:pointer;
  transition:color .15s ease, transform .15s ease;
}
.featured-dish-want:hover{
  color:#f2f7fa;
  transform:scale(1.1);
}
.featured-dish-want.active{
  color:#f59e0b;
}

/* Friends Discovery Feed Colors */
.friends-feed-item{
  border-left:3px solid var(--friend-accent, #57b9ff);
  padding-left:12px;
  margin-bottom:14px;
  border-radius:4px 0 0 4px;
  transition:border-color .2s ease;
}
.friends-feed-user-bar[data-friend-accent] .avatar-disc{
  box-shadow:0 0 0 2px var(--friend-accent, #57b9ff);
}
.friends-feed-user-bar[data-friend-accent] b{
  color:var(--friend-accent, #f2f7fa);
}

/* Non-editable UI surfaces: disable native callout and text selection */
.app,
.topbar,
.nav,
.screen,
button,
.chip,
.restaurant-card,
.highlighted-dish-card,
.featured-dish-card,
.dish-search-card,
.social-card,
.filter-chips,
.guides-hero,
.modal{
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  user-select:none;
}

/* Explicitly preserve selection, typing, copy/paste, and cursor in text entry fields */
input,
textarea,
[contenteditable="true"],
.selectable,
.selectable *{
  -webkit-touch-callout:default;
  -webkit-user-select:text;
  user-select:text;
}

/* =========================================================
   Onboarding & Food History Importer
   ========================================================= */

.guide-score.import-guide{
  background:linear-gradient(135deg,rgba(87,185,255,.24),rgba(35,68,94,.65));
  border:1px solid rgba(87,185,255,.4);
  color:var(--ocean-text);
  font-size:26px;
  box-shadow:0 8px 24px rgba(7,21,33,.5);
}

.onboarding-desc{
  margin:0 0 10px;
  line-height:1.45;
  color:var(--ocean-text);
  font-size:14px;
}

.onboarding-support{
  margin:0 0 14px;
  line-height:1.45;
  color:var(--ocean-muted);
  font-size:13px;
}

.sheet-actions-stacked{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:14px;
}

.sheet-actions-stacked .onboarding-import-primary{
  width:100%;
  padding:14px 18px;
  font-size:15px;
  font-weight:700;
  border-radius:14px;
  background:linear-gradient(135deg,var(--ocean-blue),#3b82f6);
  color:#071521;
  border:none;
  cursor:pointer;
  transition:filter .15s ease,transform .15s ease;
}

.sheet-actions-stacked .onboarding-import-primary:hover{
  filter:brightness(1.08);
}

.sheet-actions-stacked .onboarding-import-primary:active{
  transform:scale(.98);
}

.sheet-actions-sub{
  display:flex;
  gap:10px;
  width:100%;
}

.sheet-actions-sub button{
  flex:1;
}

.onboarding-import-footer{
  margin-top:14px;
  font-size:12px;
  color:var(--ocean-muted);
  text-align:center;
  line-height:1.4;
}

.import-beta-card{
  margin:12px 0 16px;
  background:rgba(18,48,74,.45);
  border:1px solid var(--ocean-line);
  border-radius:14px;
  padding:12px 14px;
  text-align:left;
}

.import-beta-card b{
  display:block;
  color:var(--ocean-blue);
  font-size:13px;
  margin-bottom:4px;
}

.import-beta-card span{
  display:block;
  font-size:12px;
  line-height:1.45;
  color:var(--ocean-muted);
}