/* TWINS v0.2.60 — Nearby information architecture and compact いまから UI */

/* The page has two independent axes: what to view, and where to view it from. */
.nearby-head{padding-bottom:8px}
.nearby-head h1{font-size:26px}
.near-location-change,.near-now-filter{display:none!important}
.near-view-switch{
  display:grid;grid-template-columns:1fr 1fr;gap:3px;
  margin:0 12px 10px;padding:3px;border:1px solid rgba(255,255,255,.08);
  border-radius:13px;background:#0e0b10;
}
.near-view-switch a{
  min-height:36px;display:flex;align-items:center;justify-content:center;
  border-radius:10px;color:#766f7a;font-size:11px;font-weight:900;text-decoration:none;
}
.near-view-switch a.active{
  color:#fff;background:rgba(255,255,255,.075);box-shadow:0 4px 16px rgba(0,0,0,.22);
}
.near-view-switch a.active:last-child{
  color:#ff82d3;background:linear-gradient(135deg,rgba(213,9,181,.16),rgba(255,255,255,.07));
}

/* Location is a setting row, not a competing primary action. */
.near-location-status{padding:0;gap:0;overflow:hidden}
.near-location-main{
  min-width:0;flex:1;display:flex;align-items:center;gap:9px;padding:9px 10px;
  text-decoration:none;color:inherit;
}
.near-location-main>div{min-width:0;flex:1}
.near-location-chevron{
  flex:0 0 auto;margin-left:auto;color:#756e7d;font-size:22px;font-weight:300;line-height:1;
}
.near-location-status button{margin:0 8px 0 0}

/* Compatibility belongs to the same bottom information line as distance. */
.nearby-grid .nearby-card-bottom{padding-right:0}
.near-name-row{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.near-meta-row{
  display:flex;align-items:baseline;justify-content:space-between;gap:8px;
  min-height:14px;margin-top:1px;
}
.near-meta-row>p{margin:0!important;line-height:1.05}
.near-compatibility{
  position:static;display:inline-flex;align-items:baseline;justify-content:flex-end;gap:1px;
  min-width:0;height:auto;padding:0;border:0;border-radius:0;background:transparent;
  color:#fff;box-shadow:none;backdrop-filter:none;font-style:normal;line-height:1;
  text-shadow:0 1px 3px rgba(0,0,0,.85),0 0 8px rgba(0,0,0,.5);
}
.near-compatibility b{font-size:12px;font-weight:950;letter-spacing:-.02em}
.near-compatibility small{font-size:8px;font-weight:900;opacity:.9}

/* Status badges stay readable but the pictogram never dominates the text. */
.now-badge{
  display:inline-flex;align-items:center;gap:3px;max-width:100%;line-height:1;
}
.now-badge svg{
  width:11px!important;height:11px!important;flex:0 0 11px!important;
  fill:none!important;stroke:currentColor!important;stroke-width:1.9!important;
  stroke-linecap:round;stroke-linejoin:round;
}
.now-badge em{min-width:0;overflow:hidden;text-overflow:ellipsis;font-style:normal}
.nearby-grid .now-badge{min-height:19px;padding:3px 6px 3px 4px;font-size:8px;gap:3px}
.nearby-grid .now-badge svg{width:10px!important;height:10px!important;flex-basis:10px!important}

/* いまから is intentionally a dense vertical feed. Fixes unconstrained SVGs that expanded rows. */
.now-list{margin-top:8px}
.now-list-row{
  grid-template-columns:84px minmax(0,1fr);gap:11px;padding:10px 2px;min-height:104px;
  align-items:start;
}
.now-list-photo{width:84px;height:84px}
.now-list-photo .near-compatibility{
  position:absolute;right:5px;bottom:5px;color:#fff;background:transparent;border:0;padding:0;
  text-shadow:0 1px 4px rgba(0,0,0,.95),0 0 8px rgba(0,0,0,.7);
}
.now-list-photo .near-compatibility b{font-size:11px}
.now-list-photo .near-compatibility small{font-size:7px}
.now-list-intent .now-badge{
  display:inline-flex;align-items:center;gap:4px;min-height:22px;padding:4px 8px 4px 6px;
  font-size:9px;line-height:1;max-width:100%;
}
.now-list-intent .now-badge svg{
  width:12px!important;height:12px!important;flex:0 0 12px!important;
}
.now-list-body>p{margin-top:6px}

/* Editor is shown only in the いまから view. Keep its choices compact. */
.near-mood-control{margin-top:0}
.near-mood-options .near-mood-choice-grid button[data-mood-value]{min-height:36px;padding:7px 9px}
.near-mood-options button[data-mood-value]::before{width:7px;height:7px;flex-basis:7px}

@media(max-width:430px){
  .near-view-switch{margin-left:10px;margin-right:10px}
  .near-location-status{margin-left:10px;margin-right:10px}
  .now-list-row{grid-template-columns:78px minmax(0,1fr);gap:10px;min-height:98px}
  .now-list-photo{width:78px;height:78px}
}
