:root {
  --lup-bg: #10121d;
  --lup-surface: #191c2a;
  --lup-surface-raised: #22263a;
  --lup-text: #f5f6ff;
  --lup-muted: #a9aec7;
  --lup-line: rgba(255,255,255,.11);
  --lup-primary: #7a5cff;
  --lup-accent: #2b9df4;
  --lup-radius: 16px;
  --lup-shadow: 0 12px 34px rgba(0,0,0,.24);
}

body, md-content { background: var(--lup-bg); color: var(--lup-text); }
body { font-family: Ubuntu, Roboto, Arial, sans-serif; letter-spacing: .01em; }

/* Add room: a location is created from a real position, not from an abstract
 * settings form. The GPS marker is the page's one distinctive visual anchor. */
.lup-add-room-page .settings-content { background:transparent; }
.lup-add-room-page .add-room-form {
  width:min(100%,680px);
  margin:0 auto;
  padding:18px 16px calc(34px + env(safe-area-inset-bottom));
  color:var(--lup-text);
}
.add-room-hero {
  display:grid;
  grid-template-columns:52px minmax(0,1fr);
  gap:12px;
  align-items:center;
  margin:2px 1px 17px;
}
.add-room-hero__mark {
  display:grid;
  width:52px;
  height:52px;
  place-items:center;
  color:#b8efff;
  border:1px solid rgba(130,218,255,.33);
  border-radius:20px 20px 20px 7px;
  background:linear-gradient(145deg,rgba(45,151,213,.26),rgba(113,85,191,.17));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 10px 26px rgba(0,0,0,.18),0 0 22px rgba(75,190,255,.13);
}
.add-room-hero__mark .material-icons { font-size:27px; }
.add-room-hero small,.add-room-section__label,.add-room-radius__head > span,.add-room-position small {
  display:block;
  color:#9bc4df;
  font-size:9px;
  font-weight:850;
  letter-spacing:.15em;
  line-height:1.2;
}
.add-room-hero h1 { margin:4px 0 5px; color:#f7f9ff; font-size:clamp(23px,6vw,31px); font-weight:820; letter-spacing:-.045em; line-height:1; }
.add-room-hero p { margin:0; color:#abbcd0; font-size:11px; line-height:1.45; }
.add-room-position {
  display:grid;
  grid-template-columns:43px minmax(0,1fr) 26px;
  gap:11px;
  align-items:center;
  min-height:70px;
  margin:0 0 20px;
  padding:10px 12px;
  color:#aab9cc;
  border:1px solid rgba(177,205,234,.15);
  border-radius:19px 19px 19px 7px;
  background:linear-gradient(115deg,rgba(44,67,99,.48),rgba(17,25,41,.70));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.add-room-position.is-ready { border-color:rgba(94,229,190,.34); background:linear-gradient(115deg,rgba(53,132,117,.25),rgba(17,29,42,.74)); }
.add-room-position__pin { display:grid; width:43px; height:43px; place-items:center; color:#a8d5f8; border-radius:50% 50% 50% 14px; background:rgba(103,178,224,.13); box-shadow:inset 0 0 0 1px rgba(139,215,255,.21); }
.add-room-position.is-ready .add-room-position__pin { color:#77efbd; background:rgba(73,205,157,.12); box-shadow:inset 0 0 0 1px rgba(109,239,187,.25),0 0 17px rgba(82,231,177,.12); }
.add-room-position strong { display:block; margin-top:4px; color:#e5eef9; font-size:12px; font-weight:720; line-height:1.25; }
.add-room-position__state { color:#77efbd; font-size:20px; }
.add-room-section { margin:0 0 20px; }
.add-room-section__label { margin:0 2px 8px; color:#c2cef0; }
.add-room-form md-input-container { margin:6px 0 14px; }
.add-room-form md-input-container .md-input,.add-room-form md-select .md-select-value {
  color:#f4f7ff;
  border-bottom-color:rgba(163,198,238,.27);
}
.add-room-form md-input-container label { color:#9fb4cc; }
.add-room-form md-input-container.md-input-focused label { color:#8adbf9; }
.add-room-form md-input-container .md-input:focus { border-bottom-color:#75d7fa; }
.add-room-form .add-room-description textarea { min-height:86px; padding:10px 11px; border:1px solid rgba(164,201,238,.15); border-radius:14px 14px 14px 5px; background:rgba(255,255,255,.035); }
.add-room-radius { margin:0 0 22px; padding:14px 13px 9px; border:1px solid rgba(156,189,232,.17); border-radius:20px 20px 20px 7px; background:linear-gradient(130deg,rgba(93,76,164,.15),rgba(20,31,50,.66)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }
.add-room-radius__head { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.add-room-radius__head > span { color:#c0b9ef; }.add-room-radius__head strong { color:#f1f4ff; font-size:18px; font-weight:800; letter-spacing:-.03em; }
.add-room-radius p { margin:6px 0 12px; color:#a7b7cc; font-size:10px; line-height:1.4; }
.add-room-radius__presets { display:flex; flex-wrap:wrap; gap:7px; }
.add-room-radius__presets button { min-width:47px; min-height:32px; padding:0 9px; color:#b9c6d9; border:1px solid rgba(191,213,241,.14); border-radius:11px 11px 11px 4px; background:rgba(255,255,255,.035); font-size:10px; font-weight:720; }
.add-room-radius__presets button.is-active { color:#f5f7ff; border-color:rgba(155,132,255,.62); background:linear-gradient(135deg,rgba(121,92,255,.54),rgba(67,157,222,.30)); box-shadow:0 0 15px rgba(121,92,255,.22); }
.add-room-radius md-slider { margin:10px 3px 0; }.add-room-radius md-slider .md-thumb:after { border-color:#a99bff; background:#a99bff; }.add-room-radius md-slider .md-track-fill { background:#8976ff; }
.add-room-submit { display:grid; width:100%; grid-template-columns:28px minmax(0,1fr) 28px; align-items:center; min-height:52px; padding:0 13px; color:#fff; border:1px solid rgba(180,216,255,.35); border-radius:17px 17px 17px 6px; background:linear-gradient(104deg,#7057df,#2a9fe0); box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 14px 26px rgba(44,102,202,.25); font-size:13px; font-weight:820; letter-spacing:.01em; text-align:left; }
.add-room-submit span { text-align:center; }.add-room-submit .material-icons:last-child { justify-self:end; }.add-room-submit:disabled { opacity:.45; box-shadow:none; }.add-room-submit:not(:disabled):active { transform:translateY(1px) scale(.995); }
@media (max-width:360px) { .lup-add-room-page .add-room-form { padding-right:11px; padding-left:11px; }.add-room-hero { grid-template-columns:45px minmax(0,1fr); gap:9px; }.add-room-hero__mark { width:45px; height:45px; border-radius:16px 16px 16px 6px; }.add-room-hero h1 { font-size:23px; }.add-room-radius { padding-right:10px; padding-left:10px; }.add-room-radius__presets { gap:5px; }.add-room-radius__presets button { min-width:43px; padding:0 7px; } }

.login, .nearby, .profile-page {
  background:
    radial-gradient(circle at 92% 4%, rgba(66,96,187,.18), transparent 28%),
    radial-gradient(circle at 8% 92%, rgba(122,92,255,.14), transparent 32%),
    var(--lup-bg);
}
.login md-content { background: transparent; }

.lup-top-bar, .lup-top-bar .md-toolbar-tools,
md-toolbar:not(.sidenav-brand), md-toolbar:not(.sidenav-brand) .md-toolbar-tools {
  background: linear-gradient(120deg, #20233a, #171b2b);
  color: var(--lup-text);
  border-bottom: 1px solid var(--lup-line);
}

md-tabs-wrapper, md-tabs-wrapper.md-stretch-tabs md-pagination-wrapper {
  background: var(--lup-surface);
  border-bottom: 1px solid var(--lup-line);
}
md-tabs .md-tab, md-tabs .md-tab.md-active { color: var(--lup-muted); }
md-tabs .md-tab.md-active { color: var(--lup-text); font-weight: 700; }
md-tabs md-ink-bar { background: linear-gradient(90deg, var(--lup-primary), var(--lup-accent)); }

md-card, .md-whiteframe-1dp, .md-whiteframe-2dp, .md-whiteframe-4dp,
body .md-dialog-container md-dialog {
  background:var(--lup-surface);
  color:var(--lup-text);
  border-radius: var(--lup-radius);
  box-shadow: var(--lup-shadow);
}

md-dialog, md-dialog-content, .md-dialog-content { background: var(--lup-surface); color: var(--lup-text); }
md-dialog md-toolbar, md-dialog md-toolbar .md-toolbar-tools { background: var(--lup-surface-raised); }

/* Keep the original notification markup; only give the bell a calmer dark treatment. */
.md-toolbar-tools .navnotification {
  width: 34px;
  height: 34px;
  margin: 0;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 12px;
  background-color: rgba(255,255,255,.06);
  background-position: center;
  background-size: 20px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09);
  transition: background-color .18s ease, transform .18s ease;
}
.md-toolbar-tools .md-button:hover .navnotification { background-color: rgba(122,92,255,.22); transform: translateY(-1px); }
.md-toolbar-tools .navnotification-count {
  top: 3px;
  right: 2px;
  left: auto;
  width: 9px;
  height: 9px;
  border: 2px solid #20233a;
  background: #ff5d7c;
  box-shadow: 0 3px 8px rgba(255,93,124,.45);
}

md-input-container .md-input, input, textarea {
  color: inherit;
  border-radius: 10px;
}
.login input[type=text], .login input[type=password],
.login md-input-container > label,
.login md-input-container:not(.md-input-invalid).md-input-focused label {
  color: var(--lup-text);
}
.login input[type=text]::placeholder, .login input[type=password]::placeholder {
  color: var(--lup-muted);
  opacity: 1;
}
.login md-input-container .md-input { border-color: var(--lup-muted); }
.login md-input-container {
  margin: 8px 8% 14px;
  padding: 0 10px;
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
}
.login md-input-container.md-input-focused {
  border-color: rgba(122,92,255,.72);
  box-shadow: 0 0 0 3px rgba(122,92,255,.12);
}
/* Keep sign-in fields understated: the content should lead, not the frame. */
.login md-input-container {
  margin: 8px 8% 12px;
  padding: 0 4px;
  background: transparent;
  border: 0;
  border-bottom: 1px solid rgba(214,207,243,.38);
  border-radius: 0;
}
.login md-input-container.md-input-focused {
  border-bottom-color: #b8a9ff;
  box-shadow: 0 2px 0 -1px rgba(184,169,255,.42);
}
.login md-input-container .md-input { padding: 5px 4px 7px; border-bottom: 0; }
/* Clear, calm sign-in card inspired by modern product onboarding. */
.login .login-credentials { width: min(88%, 410px); box-sizing: border-box; margin: 18px auto 0; padding: 18px 18px 7px; border: 1px solid rgba(255,255,255,.10); border-radius: 18px; background: rgba(27,30,45,.72); box-shadow: 0 18px 42px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.06); }
.login .login-credentials md-input-container { width: 100%; margin: 4px 0 16px; }
.login .login-credentials md-input-container > label { padding-left: 3px; color: #bdb5d4; font-size: 12px; font-weight: 650; }
.login .login-credentials input[type=text], .login .login-credentials input[type=password] { color: #f8f7ff; font-size: 16px; }
.login .login-credentials md-input-container.md-input-focused { border-bottom-color:rgba(214,207,243,.38); box-shadow:none; }.login .login-credentials input:focus, .login .login-credentials input:focus-visible { outline:0; box-shadow:none; }
.login .login-credentials md-input-container .md-input { position:relative; top:25px; line-height:24px; }

/* Login refresh: a distinct LinkUUp arrival screen, not a generic form. */
.login { min-height:100%; background:radial-gradient(circle at 50% -10%,rgba(142,111,255,.28),transparent 42%),linear-gradient(155deg,#10111d 0%,#191a2b 48%,#10131e 100%); }.login > md-content { width:min(100%,820px); max-width:none; min-height:var(--lup-viewport-height,100dvh); background:transparent; box-shadow:none; }
.login .login-brand-stage { min-height:246px; padding:0 20px; isolation:isolate; overflow:hidden; background:radial-gradient(ellipse at 50% 8%,rgba(154,124,255,.36),transparent 46%),radial-gradient(circle at 82% 73%,rgba(55,167,244,.28),transparent 32%),linear-gradient(160deg,#252442 0%,#171a2c 61%,#12141f 100%); box-shadow:inset 0 -44px 58px rgba(8,10,22,.50); }
.login .login-brand-stage::before { content:'LINKUUP'; position:absolute; z-index:-1; top:54px; left:50%; transform:translateX(-50%) scaleX(1.28); color:rgba(255,255,255,.035); font-size:clamp(56px,18vw,124px); font-weight:950; letter-spacing:-.095em; white-space:nowrap; }
.login .login-brand-stage::after { width:310px; height:310px; right:-115px; top:-151px; border-color:rgba(219,210,255,.24); box-shadow:0 0 0 30px rgba(182,164,255,.055),0 0 0 64px rgba(107,179,255,.035); opacity:1; }
.login .login-brand-glow { position:absolute; z-index:-1; bottom:-67px; left:calc(50% - 85px); width:170px; height:170px; border-radius:50%; background:#8066ec; filter:blur(45px); opacity:.48; }
.login .login-wordmark { position:relative; z-index:1; margin-top:55px; color:#fff; font-size:clamp(48px,13vw,76px); font-weight:900; letter-spacing:-.085em; line-height:.9; text-align:center; text-shadow:0 6px 24px rgba(0,0,0,.29); }.login .login-wordmark-link { color:#f8f6ff; }.login .login-wordmark-up { display:inline-block; margin-left:.025em; background:linear-gradient(135deg,#ffd77a 4%,#bda4ff 43%,#77c9ff 93%); -webkit-background-clip:text; background-clip:text; color:transparent; filter:drop-shadow(0 5px 12px rgba(112,83,232,.24)); }
.login .login-brand-claim { position:relative; z-index:1; margin:14px 0 0; color:#d8d2ea; font-size:12px; font-weight:700; letter-spacing:.075em; text-align:center; text-transform:uppercase; }.login .login-brand-route { position:relative; z-index:1; display:flex; align-items:center; justify-content:center; gap:9px; margin-top:20px; color:#ffe28e; }.login .login-brand-route span { width:51px; height:2px; border-radius:2px; background:linear-gradient(90deg,#a88bff,#84d0ff); box-shadow:0 0 12px rgba(133,191,255,.64); }.login .login-brand-route .material-icons { font-size:18px; }.login .login-brand-route .material-icons:last-child { color:#ff91ae; }
.login .login-credentials { position:relative; z-index:3; width:min(88%,430px); margin:-22px auto 0; padding:24px 22px 13px; border-color:rgba(222,215,255,.17); border-radius:25px; background:linear-gradient(145deg,rgba(43,44,69,.94),rgba(25,27,45,.94)); box-shadow:0 24px 48px rgba(0,0,0,.33),inset 0 1px 0 rgba(255,255,255,.11); }.login .login-credentials::before { content:'Willkommen zurück'; display:block; margin:0 0 12px; color:#f7f5ff; font-size:17px; font-weight:800; letter-spacing:-.02em; }
/* The redesigned auth screen supplies its own heading in the template. */
.auth-shell .login-credentials::before { content:none; display:none; }
.login .login-credentials md-input-container { margin:8px 0 18px; }.login .login-credentials md-input-container > label { color:#c9c1e2; font-size:11px; font-weight:800; letter-spacing:.055em; text-transform:uppercase; }.login .login-credentials md-input-container { border-bottom-color:rgba(229,224,247,.48); }.login .login-credentials md-input-container.md-input-focused { border-bottom-color:#d6c7ff; }.login .login-credentials .md-input { color:#fff; font-size:17px; }
.login .login-links { width:min(88%,430px); margin:3px auto 0; padding:13px 8px 5px; }.login .login-submit { width:min(88%,430px); margin:8px auto 0; }.login .login-button { width:100%; height:55px; margin:0; padding:0 18px; border:1px solid rgba(255,255,255,.22); border-radius:17px; background:linear-gradient(135deg,#a286ff,#668de9); box-shadow:0 10px 0 rgba(56,55,128,.50),0 17px 27px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.34); color:#fff; font-size:15px; font-weight:850; letter-spacing:.025em; }.login .login-button:active { transform:translateY(4px); box-shadow:0 6px 0 rgba(56,55,128,.50),0 11px 18px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.34); }
.login .login-social, .login .login-guest { width:min(88%,430px); box-sizing:border-box; margin:12px auto 0; padding:0; }.login .facebook-button, .login .instagram-button { height:47px; margin:0 4px; border:1px solid rgba(255,255,255,.16); border-radius:15px; box-shadow:0 8px 17px rgba(0,0,0,.16); }.login .facebook-button span, .login .instagram-button span { transform:scale(.72); }.login .guest-button { height:46px; margin:0; border:1px solid rgba(195,181,255,.22); border-radius:15px; background:rgba(255,255,255,.06); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); color:#e8e3f6; font-size:13px; font-weight:750; }.login .login-bottom { width:min(88%,430px); margin:21px auto 0; padding-bottom:24px; }.login .login-bottom .md-list-item-inner { min-height:30px; }.login .login-bottom p { color:#aaa2c0; font-size:11px; }.login .login-bottom ._md-button-wrap:hover p { color:#d8ceff; }
@media (min-width:760px) { .login > md-content { width:760px; }.login .login-brand-stage { min-height:278px; }.login .login-wordmark { margin-top:63px; } }

/* The mark is deliberately original: premium geometry without borrowing another brand. */
.login .login-brand-stage { min-height:272px; background:radial-gradient(ellipse at 50% 4%,rgba(167,142,255,.28),transparent 43%),radial-gradient(circle at 80% 76%,rgba(72,171,242,.22),transparent 32%),linear-gradient(160deg,#25263d 0%,#181a2b 60%,#11131e 100%); }.login .login-brand-stage::before { top:59px; color:rgba(255,255,255,.027); letter-spacing:-.11em; }.login .login-emblem { position:relative; z-index:1; display:grid; place-items:center; width:43px; height:43px; margin:39px auto 13px; border:1px solid rgba(242,238,255,.54); border-radius:50%; box-shadow:0 0 0 5px rgba(255,255,255,.035),0 11px 26px rgba(0,0,0,.23),inset 0 1px 0 rgba(255,255,255,.18); }.login .login-emblem::before, .login .login-emblem::after, .login .login-emblem span { content:''; position:absolute; width:1px; height:28px; border-radius:2px; transform-origin:50% 100%; background:linear-gradient(#fff,#a999ff); box-shadow:0 0 8px rgba(190,177,255,.45); }.login .login-emblem::before { transform:translateY(-7px) rotate(-119deg); }.login .login-emblem::after { transform:translateY(-7px) rotate(119deg); }.login .login-emblem span { transform:translateY(-7px); }.login .login-wordmark { margin-top:0; color:#fff; font-family:Arial,sans-serif; font-size:clamp(47px,12.5vw,72px); font-weight:650; letter-spacing:-.095em; line-height:.86; text-shadow:0 7px 23px rgba(0,0,0,.30); }.login .login-wordmark-link { font-weight:620; letter-spacing:-.105em; }.login .login-wordmark-up { margin-left:.055em; font-weight:820; letter-spacing:-.12em; background:linear-gradient(135deg,#f5efff 5%,#c1abff 48%,#75c8f6 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }.login .login-brand-claim { max-width:260px; margin:14px auto 0; color:#cbc5dc; font-size:12px; font-weight:550; letter-spacing:.015em; line-height:1.45; text-align:center; text-transform:none; }.login .login-brand-route { margin-top:15px; opacity:.76; }.login .login-button { border-color:rgba(235,230,255,.26); background:linear-gradient(105deg,#9378ec 0%,#728ce7 52%,#55a9e8 100%); box-shadow:0 12px 25px rgba(59,67,155,.32),inset 0 1px 0 rgba(255,255,255,.28); }.login .login-button:active { transform:translateY(1px); box-shadow:0 7px 16px rgba(59,67,155,.28),inset 0 1px 0 rgba(255,255,255,.25); }
@media (min-width:760px) { .login .login-brand-stage { min-height:298px; }.login .login-emblem { margin-top:47px; } }
.login .login-links { width: min(88%, 410px); box-sizing: border-box; margin: 0 auto; padding: 10px 4px 4px; }
.login .signup, .login .pwforgot { margin: 0; font-size: 12px; }
.login .signup { color: var(--lup-muted); }
.login .signup a, .login .pwforgot a { color: #c8bcff; font-weight: 700; text-decoration: none; }
.login .login-submit { width: min(88%, 410px); box-sizing: border-box; margin: 4px auto 0; padding: 0; }
.login .login-submit .login-button { height: 48px; margin: 0; padding: 0 18px; border: 1px solid rgba(255,255,255,.16); border-radius: 14px; font-size: 15px; letter-spacing: .01em; }
.login .guest-button { width: min(88%, 410px); height: 42px; margin: 10px auto 0; padding: 0 16px; border: 1px solid rgba(255,255,255,.16); border-radius: 13px; background: rgba(255,255,255,.06); color: #e9e6f5; font-size: 13px; font-weight: 700; }
/* One button system and a continuous LinkUUp backdrop for the whole login flow. */
.login .login-brand-stage { margin-bottom: -1px; box-shadow: inset 0 -18px 34px rgba(16,18,29,.28); }
.login .login-brand-stage::after { opacity: .34; }
.login > md-content, .login .login-bottom { background: transparent; }
.login .login-button, .login .facebook-button, .login .instagram-button, .login .guest-button {
  height: 48px;
  min-height: 48px;
  box-sizing: border-box;
  border-radius: 14px;
  font-size: 14px;
  font-weight: 700;
}
.login .facebook-button, .login .instagram-button { margin: 0 4px; padding: 0; border: 1px solid rgba(255,255,255,.13); }
.login .facebook-button span, .login .instagram-button span { width: 25px; height: 25px; background-size: 25px; }
.login .guest-button { height: 48px; margin-top: 10px; }
.login .login-social { display: flex; gap: 10px; width: min(88%, 410px); box-sizing: border-box; margin: 10px auto 0; padding: 0; }
.login .login-social .facebook-button, .login .login-social .instagram-button { flex: 1 1 0; width: auto; margin: 0; }
.login .login-guest { display: flex; width: min(88%, 410px); box-sizing: border-box; margin: 10px auto 0; padding: 0; }
.login .login-guest .guest-button { width: 100%; margin: 0; }
/* Guest entry is the same clear journey, without the legacy oversized controls. */
.login .guest-credentials { width: min(88%, 410px); box-sizing: border-box; margin: 18px auto 0; padding: 18px 18px 12px; border: 1px solid rgba(255,255,255,.10); border-radius: 18px; background: rgba(27,30,45,.72); box-shadow: 0 18px 42px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.06); }
.login .guest-credentials md-input-container { width: 100%; margin: 4px 0 12px; padding: 0 4px; }
.login .guest-credentials md-input-container > label { padding-left: 3px; color: #bdb5d4; font-size: 12px; font-weight: 650; }
.login .guest-credentials input[type=text] { color: #f8f7ff; font-size: 16px; }
.login .guest-submit, .login .guest-back { width: min(88%, 410px); box-sizing: border-box; margin: 10px auto 0; padding: 0; }
.login .guest-submit .login-button, .login .guest-back .backtologin { width: 100%; height: 48px; min-height: 48px; margin: 0; padding: 0 16px; border-radius: 14px; font-size: 14px; font-weight: 700; }
.login .guest-back { margin-top: 8px; }
.login .guest-back .backtologin { border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.055); color: #e9e6f5; }
.login .guest-credentials .tos-line { display: grid; grid-template-columns: 24px minmax(0, 1fr); column-gap: 8px; align-items: start; height: auto; min-height: 48px; margin: 8px 0 2px; }
.login .guest-credentials .tos-line .check { grid-column: 1; margin: 2px 0 0; }
.login .guest-credentials .tos-line span { grid-column: 2; padding-left: 0; color: #c9c3da; font-size: 12px; line-height: 18px; overflow-wrap: anywhere; }
.login .guest-credentials .lup-tos-line a { color: #b9a7ff; text-decoration-color: rgba(185,167,255,.7); }
.login .guest-credentials .tos-line .error { grid-column: 2; top: 0; left: 0; margin-top: 3px; }
md-button.md-raised, .md-button.md-raised {
  border-radius: 999px;
  box-shadow: 0 7px 15px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.15);
  text-transform: none;
  font-weight: 700;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.md-button.md-primary.md-raised {
  background: linear-gradient(135deg, var(--lup-primary), var(--lup-accent));
  color: #fff;
}
.md-button.md-raised:hover:not([disabled]) {
  transform: translateY(-1px);
  filter: brightness(1.07);
  box-shadow: 0 10px 20px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.2);
}
.md-button.md-raised:active:not([disabled]) {
  transform: translateY(1px) scale(.985);
  box-shadow: 0 3px 8px rgba(0,0,0,.24), inset 0 1px 3px rgba(0,0,0,.16);
}

.roominfosingle { background: var(--lup-surface); border-color: var(--lup-line); }
.roominfosingle .address { display: flex; align-items: center; gap: 8px; padding: 10px 14px; text-decoration: none; }
.roominfosingle .addressmap { flex: 0 0 32px; margin: 0; }
.roominfosingle .room-route-address { color: var(--lup-text); font-size: 13px; text-align: left; }
.roominfo, .room-category-hero, .lup-room-slide { transition: transform .28s ease, box-shadow .28s ease, opacity .28s ease; }

/* Discovery is one continuous canvas; cards get depth, not hard outlines. */
.nearby md-content.greybg, .nearby .search-input-wrap,
.nearby .location-categories { background: transparent; }
.nearby .roominfo {
  border: 0;
  border-radius: 22px;
  background: rgba(27,30,45,.92);
  box-shadow: var(--lup-shadow);
  /* The category emblem deliberately rises above the card. */
  overflow: visible;
}
.nearby .search-input {
  background-color: rgba(255,255,255,.07);
  border-color: rgba(255,255,255,.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.location-categories {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 5px;
	overflow: visible;
	margin: 1px 10px 12px;
	padding: 7px;
	border: 1px solid rgba(255,255,255,.09);
	border-radius: 18px;
	background: linear-gradient(135deg, rgba(255,255,255,.065), rgba(122,92,255,.055));
	box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 9px 22px rgba(0,0,0,.13);
}
.location-categories button {
	position: relative;
	min-width: 0;
	min-height: 45px;
	padding: 4px 5px;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
	gap: 2px;
	border-radius: 10px;
  border-color: transparent;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
  transition: transform .20s ease, background .20s ease, box-shadow .20s ease, border-color .20s ease;
}
.location-categories button .material-icons {
	width: auto;
	height: 21px;
	padding: 0;
	box-sizing: border-box;
	border-radius: 0;
	background: transparent;
	font-size: 20px;
	line-height: 21px;
	box-shadow: none;
	opacity: .82;
  transition: transform .22s cubic-bezier(.18,.78,.22,1), background .22s ease;
}
.location-categories button span { font-size: 8px; line-height: 1.05; font-weight: 750; letter-spacing:.01em; }
.location-categories button:not(.active) { background: rgba(255,255,255,.025); border-color: transparent; }
.location-categories button:hover:not(.active) { transform: translateY(-1px); background: rgba(255,255,255,.07); }
.location-categories button.active { border-color: rgba(167,152,255,.30); background: linear-gradient(145deg, rgba(122,92,255,.45), rgba(43,157,244,.18)); box-shadow: inset 0 1px 0 rgba(255,255,255,.16); }
.location-categories button.active::after { content: ''; position: absolute; bottom: 4px; width: 14px; height: 2px; border-radius: 999px; background: #fff; box-shadow: 0 0 8px rgba(255,255,255,.75); }
.location-categories button.active .material-icons { background:transparent; transform:translateY(-1px); opacity:1; }
.location-categories button:nth-child(2) .material-icons { color: #b8c8e7; }
.location-categories button:nth-child(3) .material-icons { color: #dfc29a; }
.location-categories button:nth-child(4) .material-icons { color: #d1a9df; }
.location-categories button:nth-child(5) .material-icons { color: #b8c8e7; }
@media (min-width: 760px) {
  .location-categories { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
.category-university { background: linear-gradient(135deg, #41316f, #7275e7); }
.category-health { background: linear-gradient(135deg, #a32d58, #ef6f90); }

/* Discovery cards stay deliberate on every screen instead of becoming wide slabs. */
.nearby .lup-room-slide-outer { padding: 20px 12px 30px; }
.nearby .lup-room-slide { height: auto; }
.nearby .roominfo { width: min(100%, 390px); min-height: 336px; margin: 24px auto 0; }
/* The large swipe marker is an emblem, not a stretched billboard. */
.nearby .room-category-hero {
	position: relative;
  width: 128px;
  height: 128px;
  margin: -32px auto 0;
  border-radius: 36px;
  gap: 4px;
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 14px 30px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.22);
}
.nearby .room-category-hero::before { content: ''; position: absolute; inset: 12px; border-radius: 28px; border: 1px solid rgba(255,255,255,.12); }
.nearby .room-category-hero .material-icons { position: relative; z-index: 1; font-size: 56px; }
.nearby .room-category-hero span { position: relative; z-index: 1; max-width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.nearby .roominfo { min-height:362px; }
.nearby .room-category-hero { width:150px; height:150px; margin-top:-43px; border-radius:42px; border-color:rgba(255,255,255,.24); box-shadow:0 18px 0 rgba(23,21,58,.28),0 28px 42px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.28); }
.nearby .room-category-hero::before { inset:14px; border-radius:33px; }.nearby .room-category-hero .material-icons { font-size:64px; }.nearby .room-category-hero span { max-width:120px; font-size:11px; }
.nearby .chatbutton { width: min(100%, 390px); margin: 7px auto 0; }
.nearby .chatbutton.chatbutton--locked { width:min(72%,275px); margin-top:10px; }
.nearby .chatbutton.chatbutton--locked button { height:36px; min-height:36px; margin:0; border:1px solid rgba(255,255,255,.10); border-radius:999px; background:rgba(30,29,48,.50); color:#b9b2cc; font-size:10px; font-weight:700; letter-spacing:.035em; box-shadow:none; }
.nearby .chatbutton.chatbutton--locked button::before { content:'location_on'; margin-right:5px; font-family:'Material Icons'; font-size:14px; vertical-align:-2px; color:#9f8bf0; }
@keyframes lup-emblem-arrive {
  0% { transform: translateY(13px) scale(.86) rotate(-5deg); opacity: .35; }
  70% { transform: translateY(-3px) scale(1.035) rotate(1deg); opacity: 1; }
  100% { transform: none; opacity: 1; }
}
@keyframes lup-chat-ready {
  0% { transform: translateY(22px) scale(.72); opacity: 0; }
  72% { transform: translateY(-3px) scale(1.045); opacity: 1; }
  100% { transform: none; opacity: 1; }
}

.nearby .roomhead,
.nearby .distrat,
.nearby .room-user-preview { position: relative; top: 16px; }
.nearby .distrat {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 39px;
  box-sizing: border-box;
}
.nearby .roominfo .rating,
.nearby .roominfo .distance { float: none; }
.nearby .roominfo .rating { flex: 0 0 104px; width: 104px; cursor: pointer; }
.nearby .roominfo .rating p { display: flex; align-items: center; margin: 0; }
.nearby .roominfo .rating .jk-rating-stars-container { float: none; white-space: nowrap; }
.nearby .roominfo .rating .jk-rating-stars-container .button .material-icons { font-size: 14px; }
.nearby .roominfo .distance { flex: 1 1 auto; width: auto; min-width: 0; }
.nearby .roominfo .distance p { overflow: hidden; margin: 0; text-overflow: ellipsis; white-space: nowrap; }
.lup-quick-vote-dialog { width: min(92vw, 390px); }
.quick-vote-content { text-align: center; }
.quick-vote-content p { margin: 4px 0 16px; color: var(--lup-muted); }
.quick-vote-content .jk-rating-stars-container { display: inline-flex; }
.nearby .roomhead .roomname {
  min-height: 40px;
  margin: 7px 0;
}
.nearby .roomhead .roomname span {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  font-size: clamp(.95rem, 3.8vw, 1.08rem);
  line-height: 1.16;
  overflow-wrap: anywhere;
}
.nearby .room-user-preview { display: flex; align-items: center; min-height: 42px; gap: 3px; }
.nearby .room-presence-count { display: inline-flex; align-items: center; gap: 4px; margin-left: auto; padding: 6px 9px; border: 1px solid rgba(85,214,154,.25); border-radius: 999px; background: rgba(85,214,154,.10); color: #9aead0; font-size: 11px; font-style: normal; cursor: pointer; white-space: nowrap; }
.nearby .room-presence-count .material-icons { font-size: 15px; }
.nearby .room-user-preview .lup-avatar { position: relative; z-index: 1; width: 31px; height: 31px; margin: 0 0 0 -9px; border: 2px solid #202131; border-radius: 50%; overflow: hidden; }
.nearby .room-user-preview .lup-avatar:first-child { margin-left: 0; }.nearby .room-user-preview .lup-avatar:nth-child(2) { z-index: 2; }.nearby .room-user-preview .lup-avatar:nth-child(3) { z-index: 3; }
.nearby .room-user-preview .lup-avatar img { width: 31px; height: 31px; object-fit: cover; }.nearby .room-user-preview .more-users { z-index: 4; flex: 0 0 34px; width: 34px; height: 34px; margin-left: -7px; border: 2px solid #202131; border-radius: 50%; background: linear-gradient(135deg,#866df1,#5f8ee5); color: #fff; box-shadow: 0 5px 13px rgba(0,0,0,.22); cursor: pointer; }.nearby .room-user-preview .more-users b { font-size: 10px; line-height: 30px; }

/* Category icons become distinct little destinations: vivid, but still readable. */
.location-categories { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 4px; padding: 7px 8px; }
.location-categories button { min-height: 52px; padding: 5px 1px 4px; overflow: visible; background: rgba(255,255,255,.035); }
.location-categories button .material-icons { position: relative; display: grid; place-items: center; width: 29px; height: 29px; padding: 0; border: 1px solid rgba(255,255,255,.16); border-radius: 11px; color: #fff; font-size: 18px; box-shadow: 0 5px 13px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.26); }
.location-categories button span { margin-top: 2px; color: #dcd7eb; font-size: 6.5px; letter-spacing: -.01em; }
.location-categories button:nth-child(1) .material-icons { background: linear-gradient(135deg,#6f5fe7,#b274f2); }
.location-categories button:nth-child(2) .material-icons { background: linear-gradient(135deg,#3178d6,#6fc8ff); }
.location-categories button:nth-child(3) .material-icons { background: linear-gradient(135deg,#e36d49,#f5ba5c); }
.location-categories button:nth-child(4) .material-icons { background: linear-gradient(135deg,#8e35d5,#f65ec9); }
.location-categories button:nth-child(5) .material-icons { background: linear-gradient(135deg,#287a9e,#64c6d4); }
.location-categories button:nth-child(6) .material-icons { background: linear-gradient(135deg,#d55b75,#ee9a6a); }
.location-categories button:hover:not(.active) .material-icons { transform: translateY(-3px) rotate(-7deg) scale(1.08); box-shadow: 0 9px 20px rgba(0,0,0,.32), 0 0 16px currentColor; }
.location-categories button.active .material-icons { transform: translateY(-3px) rotate(5deg) scale(1.13); box-shadow: 0 10px 23px rgba(123,95,255,.42), 0 0 18px rgba(192,174,255,.45), inset 0 1px 0 rgba(255,255,255,.32); }
.nearby .room-category-hero { isolation: isolate; overflow: visible; }
.nearby .room-category-hero::after { content: ''; position:absolute; z-index:-1; inset:-12px; border-radius:42px; background:inherit; filter:blur(20px); opacity:.50; transform:scale(.86); }
.nearby .room-category-hero .material-icons { filter: drop-shadow(0 5px 7px rgba(0,0,0,.25)); }

/* The large swipe graphic is a place poster: name first, category as a glowing signal. */
.nearby .room-category-hero { display: grid; grid-template-columns: 82px minmax(0,1fr); grid-template-rows: auto minmax(0,1fr) auto; align-items: center; width: calc(100% - 20px); height: 174px; margin: 9px auto 0; padding: 17px 18px 16px 15px; box-sizing: border-box; border-radius: 23px; overflow: hidden; text-align: left; cursor: pointer; }
.nearby .room-category-hero::before { z-index: 0; inset: auto -35px -68px auto; width: 180px; height: 180px; border: 22px solid rgba(255,255,255,.10); border-radius: 50%; }
.nearby .room-category-hero::after { z-index: 0; inset: 0; border-radius: inherit; background-image: radial-gradient(rgba(255,255,255,.22) 1px,transparent 1.4px); background-size: 13px 13px; filter: none; opacity: .24; transform: none; }
.room-category-orbit { position: relative; z-index: 1; grid-row: 1 / 4; display: grid; place-items: center; width: 68px; height: 74px; border: 1px solid rgba(255,255,255,.30); border-radius: 23px; background: linear-gradient(155deg,rgba(255,255,255,.22),rgba(17,17,34,.24)); box-shadow: 0 13px 26px rgba(0,0,0,.27), inset 0 1px 0 rgba(255,255,255,.28); transform: rotate(-7deg); }
.room-category-orbit::before { content:''; position:absolute; inset:7px; border:1px solid rgba(255,255,255,.15); border-radius:17px; }.room-category-orbit::after { content:''; position:absolute; z-index:-1; width:78px; height:78px; border-radius:50%; background:rgba(255,255,255,.38); filter:blur(17px); opacity:.32; }
.nearby .room-category-hero .room-category-orbit .material-icons { color: #fff; font-size: 39px; filter: drop-shadow(0 5px 7px rgba(0,0,0,.34)); }
.room-category-name, .room-hero-name, .room-hero-hint { position: relative; z-index: 1; display: block; min-width: 0; }
.nearby .room-category-hero .room-category-name { align-self: end; max-width: none; overflow: hidden; color: rgba(255,255,255,.78); font-size: 10px; font-weight: 800; letter-spacing: .10em; line-height: 1; text-transform: uppercase; text-overflow: ellipsis; white-space: nowrap; }
.room-hero-name { align-self: center; overflow: hidden; color: #fff; font-size: clamp(23px,6.5vw,31px); line-height: .98; letter-spacing: -.04em; text-shadow: 0 5px 16px rgba(0,0,0,.28); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.room-hero-hint { display: inline-flex; align-items: center; gap: 3px; align-self: end; margin-top:7px; color: rgba(255,255,255,.88); font-size: 10px; font-weight: 750; }.room-hero-hint .material-icons { font-size: 16px; }
.nearby .roomhead { display: none; }.nearby .distrat, .nearby .room-user-preview { top: 12px; }
@keyframes lup-poster-drift { 0%,100% { opacity:.20; transform:translateX(-3px); } 50% { opacity:.34; transform:translateX(4px); } }
@keyframes lup-poster-orbit { 0%,100% { transform:translate(0,0) scale(1); } 50% { transform:translate(-7px,-4px) scale(1.05); } }
@keyframes lup-orbit-breathe { 0%,100% { transform:rotate(-7deg) scale(1); } 50% { transform:rotate(-2deg) scale(1.045); } }
@keyframes lup-name-settle { 0% { opacity:0; transform:translateY(10px); letter-spacing:.02em; } 100% { opacity:1; transform:none; } }
/* The place emblem has a physical, coin-like depth when the carousel settles. */
.nearby .room-category-hero { perspective:700px; }
.nearby .room-category-orbit { border-color:rgba(255,255,255,.46); background:linear-gradient(145deg,rgba(255,255,255,.38) 0%,rgba(158,132,255,.34) 26%,rgba(43,51,122,.62) 100%); box-shadow:0 18px 0 rgba(22,19,67,.30),0 25px 34px rgba(0,0,0,.38),inset 0 2px 1px rgba(255,255,255,.43),inset 0 -8px 12px rgba(11,10,39,.25); transform:rotate(-8deg) rotateX(8deg); }
.room-category-orbit::before { inset:6px; border-color:rgba(255,255,255,.28); box-shadow:inset 0 1px 3px rgba(255,255,255,.35); }
.room-category-orbit::after { width:86px; height:86px; background:radial-gradient(circle,rgba(255,255,255,.66),rgba(143,112,255,.24) 38%,transparent 72%); filter:blur(12px); opacity:.55; }
.nearby .room-category-hero .room-category-orbit .material-icons { transform:translateY(-2px); filter:drop-shadow(0 3px 0 rgba(35,29,92,.58)) drop-shadow(0 9px 8px rgba(0,0,0,.38)); }
@keyframes lup-orbit-3d { 0%,100% { transform:rotate(-8deg) rotateX(8deg) translateY(0) scale(1); } 50% { transform:rotate(-2deg) rotateX(-3deg) translateY(-6px) scale(1.065); } }
/* A swipe destination gets a sculptural seal instead of a plain app-icon tile. */
.nearby .room-category-orbit { width:78px; height:86px; border:0; border-radius:30px 30px 30px 12px; background:linear-gradient(145deg,#c5b9ff 0%,#7961e9 42%,#313d9b 100%); box-shadow:0 8px 0 rgba(35,30,104,.52),0 19px 28px rgba(0,0,0,.38),inset 0 2px 1px rgba(255,255,255,.48),inset 0 -9px 13px rgba(22,18,78,.30); }
.nearby .room-category-orbit::before { inset:9px; border:0; border-radius:22px 22px 22px 8px; background:radial-gradient(circle at 30% 20%,rgba(255,255,255,.58),rgba(255,255,255,.08) 35%,transparent 36%),rgba(11,14,59,.16); box-shadow:inset 0 1px 0 rgba(255,255,255,.28); }
.nearby .room-category-orbit::after { width:102px; height:102px; background:radial-gradient(circle,rgba(186,167,255,.55),rgba(115,82,240,.20) 42%,transparent 72%); opacity:.72; }
.nearby .room-category-hero .room-category-orbit .material-icons { position:relative; z-index:1; font-size:42px; transform:translateY(-2px); filter:drop-shadow(0 3px 0 rgba(43,31,117,.56)) drop-shadow(0 10px 8px rgba(0,0,0,.34)); }
.nearby .room-category-hero.category-bar .room-category-orbit, .nearby .room-category-hero.category-pub .room-category-orbit, .nearby .room-category-hero.category-food .room-category-orbit { background:linear-gradient(145deg,#ffd28a,#e57b50 43%,#a53f72); box-shadow:0 8px 0 rgba(128,50,75,.52),0 19px 28px rgba(0,0,0,.38),inset 0 2px 1px rgba(255,255,255,.48),inset 0 -9px 13px rgba(111,36,68,.30); }
.nearby .room-category-hero.category-club .room-category-orbit, .nearby .room-category-hero.category-culture .room-category-orbit { background:linear-gradient(145deg,#ffc1f1,#d85bd9 43%,#5036ab); }
.nearby .room-category-hero.category-cafe .room-category-orbit { background:linear-gradient(145deg,#ffe3a7,#c88654 43%,#69416f); }
.nearby .room-category-hero.category-community .room-category-orbit, .nearby .room-category-hero.category-university .room-category-orbit { background:linear-gradient(145deg,#a4f0ff,#3aa7d7 43%,#345bb0); }
.nearby .room-category-hero.category-health .room-category-orbit { background:linear-gradient(145deg,#ffc0d1,#ee6789 43%,#8a3d83); }
/* The space around the seal becomes a layered location stage, not empty card space. */
.nearby .roominfo { position:relative; border:1px solid rgba(190,177,255,.16); background:radial-gradient(circle at 14% 11%,rgba(134,103,244,.24),transparent 33%),radial-gradient(circle at 92% 92%,rgba(52,163,238,.13),transparent 37%),linear-gradient(155deg,rgba(38,40,66,.98),rgba(21,23,38,.98)); box-shadow:0 22px 46px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.09),inset 0 -1px 0 rgba(0,0,0,.25); }
.nearby .roominfo::before { content:''; position:absolute; top:194px; left:13px; right:13px; height:1px; background:linear-gradient(90deg,transparent,rgba(190,177,255,.42),transparent); box-shadow:0 0 12px rgba(145,117,255,.20); }
.nearby .distrat { margin:0 13px; padding:0 10px; border:1px solid rgba(255,255,255,.075); border-radius:13px; background:rgba(255,255,255,.045); box-shadow:inset 0 1px 0 rgba(255,255,255,.055); }
.nearby .room-user-preview { margin:8px 13px 0; padding:7px 9px; border:1px solid rgba(255,255,255,.07); border-radius:14px; background:linear-gradient(90deg,rgba(122,92,255,.12),rgba(255,255,255,.035)); box-shadow:inset 0 1px 0 rgba(255,255,255,.055); }
.nearby .room-presence-count { background:rgba(85,214,154,.13); box-shadow:0 5px 12px rgba(46,178,126,.10),inset 0 1px 0 rgba(255,255,255,.10); }
.nearby .roominfo { min-height:448px; perspective:900px; }
.nearby .room-category-hero { height:246px; padding-top:25px; padding-bottom:24px; }
.nearby .roominfo::before { top:266px; }
.nearby .distrat { height:34px; margin-left:22px; margin-right:22px; padding:0 8px; border-radius:11px; opacity:.90; }.nearby .roominfo .rating { flex-basis:92px; width:92px; }.nearby .roominfo .rating .jk-rating-stars-container .button .material-icons { font-size:12px; }.nearby .roominfo .distance p { font-size:10px; }
.nearby .room-user-preview { min-height:36px; margin:8px 22px 0; padding:5px 7px; border-radius:11px; opacity:.90; }.nearby .room-user-preview .lup-avatar { width:27px; height:27px; }.nearby .room-user-preview .lup-avatar img { width:27px; height:27px; }.nearby .room-user-preview .more-users { flex-basis:30px; width:30px; height:30px; }.nearby .room-user-preview .more-users b { font-size:9px; line-height:26px; }.nearby .room-presence-count { padding:5px 7px; font-size:10px; }.nearby .room-presence-count .material-icons { font-size:13px; }
.nearby .room-user-preview { margin-top:13px; }
.nearby .room-user-preview { margin-top:10px; }.nearby .distrat { margin-top:17px; }.nearby .distrat .distance a { display:flex; align-items:center; gap:5px; color:#d7d0eb; text-decoration:none; }.nearby .distrat .distance .material-icons { color:#ac98ff; font-size:16px; }
.nearby .distrat { display:flex; align-items:stretch; height:62px; margin-right:18px; margin-left:18px; padding:0; overflow:hidden; border:1px solid rgba(190,177,255,.18); border-radius:16px; background:linear-gradient(135deg,rgba(106,80,199,.20),rgba(35,47,87,.28)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 10px 20px rgba(0,0,0,.14); }.nearby .distrat .rating,.nearby .distrat .distance { display:flex; align-items:center; float:none; width:50%; padding:0 12px; box-sizing:border-box; cursor:pointer; }.nearby .distrat .rating { border-right:1px solid rgba(255,255,255,.11); }.nearby .distrat .rating:hover,.nearby .distrat .distance:hover { background:rgba(255,255,255,.065); }.nearby .distrat .rating p,.nearby .distrat .distance p { margin:0; }.nearby .distrat .distance a { flex-direction:row; align-items:center; gap:8px; color:#e5e0ef; font-size:11px; font-weight:750; }.nearby .distrat .distance a::before { content:'location_on'; display:grid; place-items:center; flex:0 0 31px; width:31px; height:31px; border-radius:11px; background:linear-gradient(145deg,#a993ff,#657fd9); box-shadow:0 5px 10px rgba(43,35,111,.32),inset 0 1px 0 rgba(255,255,255,.28); font-family:'Material Icons'; color:#fff; font-size:19px; line-height:1; }
.nearby .distrat { height:48px; margin-top:16px; overflow:visible; border:0; border-radius:0; background:transparent; box-shadow:none; }.nearby .distrat .rating,.nearby .distrat .distance { width:auto; padding:0; }.nearby .distrat .rating { margin-right:20px; border:0; }.nearby .distrat .rating:hover,.nearby .distrat .distance:hover { background:transparent; filter:brightness(1.13); }.nearby .distrat .distance a { font-size:12px; }.nearby .distrat .distance a::before { flex-basis:34px; width:34px; height:34px; border-radius:12px; }
/* Location cuddles are deliberately separate from a rating: a venue can later confirm them via its on-site QR code. */
.nearby .distrat { display:block; position:relative; top:48px; left:0; float:none; width:calc(100% - 26px); height:74px; margin:16px 13px 0; padding:0; box-sizing:border-box; transform:none; }
.nearby .distrat .location-cuddles,
.nearby .distrat .distance { display:flex; flex:0 0 auto; align-items:center; min-width:0; margin:0; padding:0; }
.nearby .distrat .location-cuddles { position:absolute; top:28px; left:26%; display:grid; place-items:center; width:52px; height:52px; border:1px solid rgba(255,214,231,.42); border-radius:17px 17px 17px 7px; background:linear-gradient(135deg,rgba(255,255,255,.30) 0 7%,transparent 7% 13%,rgba(255,255,255,.14) 13% 19%,transparent 19% 25%,rgba(255,255,255,.12) 25% 31%,transparent 31%),linear-gradient(145deg,#ffb3ca,#dc6799 57%,#8f4e9e); box-shadow:0 4px 9px rgba(105,40,89,.30),0 13px 23px rgba(0,0,0,.25),0 0 20px rgba(231,103,156,.13),inset 0 2px 1px rgba(255,255,255,.44); color:#fff; cursor:pointer; transform:translateX(-50%); transition:transform .22s ease,filter .22s ease; }
.nearby .distrat .location-cuddles:hover { transform:translateX(-50%) translateY(-3px) rotate(-2deg) scale(1.05); filter:brightness(1.12); }
.nearby .distrat .location-cuddles::after { content:'HIGH FIVE'; position:absolute; top:calc(100% + 8px); left:50%; transform:translateX(-50%); color:#ffc2d6; font-size:8px; font-weight:900; letter-spacing:.12em; white-space:nowrap; }
.nearby .distrat .location-cuddles > .material-icons { color:inherit; font-size:30px; line-height:1; filter:drop-shadow(0 2px 0 rgba(111,42,85,.40)); }
.nearby .distrat .location-cuddles strong { position:absolute; right:-10px; bottom:-9px; display:grid; place-items:center; min-width:23px; height:23px; padding:0 4px; border:2px solid #30223c; border-radius:12px; background:linear-gradient(145deg,#f8c07d,#e57975); box-shadow:0 4px 0 rgba(123,57,67,.48),0 7px 11px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.35); color:#fff; font-size:11px; line-height:1; }
.nearby .distrat .distance { position:absolute; top:29px; left:calc(26% + 114px); align-items:flex-start; }
.nearby .distrat .distance p { min-width:0; margin:0; }
.nearby .distrat .distance a { position:relative; display:flex; flex-direction:column; align-items:center; gap:5px; min-width:55px; background:none; color:#e7e1f5; font-size:10px; font-weight:900; letter-spacing:.02em; text-align:center; text-decoration:none; }
.nearby .distrat .distance a::before { content:'location_on'; display:grid; place-items:center; width:47px; height:47px; border:1px solid rgba(189,240,250,.39); border-radius:50% 50% 50% 12px; background:radial-gradient(circle at 29% 24%,#dafaff 0 8%,transparent 9% 100%),linear-gradient(145deg,#79cfe4,#4386c7 64%,#344d9b); box-shadow:0 4px 9px rgba(32,72,137,.30),0 14px 24px rgba(0,0,0,.25),0 0 0 6px rgba(93,190,228,.07),0 0 21px rgba(91,195,235,.17),inset 0 2px 1px rgba(255,255,255,.44); font-family:'Material Icons'; color:#fff; font-size:26px; line-height:1; transition:transform .22s ease,filter .22s ease,box-shadow .22s ease; }
.nearby .distrat .distance a:hover::before { transform:translateY(-4px) rotate(-3deg) scale(1.07); filter:brightness(1.14); box-shadow:0 6px 12px rgba(32,72,137,.35),0 18px 27px rgba(0,0,0,.28),0 0 0 8px rgba(93,190,228,.11),0 0 26px rgba(112,214,246,.30),inset 0 2px 1px rgba(255,255,255,.44); }
.nearby .distrat .distance a::after { content:'WEG FINDEN'; color:#b9addf; font-size:8px; font-weight:900; letter-spacing:.12em; line-height:1; }
.nearby .distrat .distance a > span { display:block; max-width:90px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@media (max-width:380px) { .nearby .distrat { top:46px; left:0; width:calc(100% - 20px); margin-left:10px; margin-right:10px; transform:none; }.nearby .distrat .location-cuddles { width:48px; height:48px; }.nearby .distrat .distance { left:calc(26% + 90px); }.nearby .distrat .distance a::before { width:43px; height:43px; } }

/* The location identity is a compact signature now, not a poster competing with the rest of the card. */
.nearby .roominfo { min-height:408px; }
.nearby .roominfo::before { top:153px; }
.nearby .room-category-hero { display:grid; grid-template-columns:82px minmax(0,1fr); grid-template-rows:auto minmax(0,1fr); width:calc(100% - 28px); height:132px; margin:10px auto 0; padding:15px 16px 14px 14px; border-radius:20px; }
.nearby .room-category-hero::before { inset:auto -46px -80px auto; width:156px; height:156px; border-width:18px; }
.nearby .room-category-hero::after { opacity:.16; background-size:15px 15px; }
.nearby .room-category-orbit { grid-row:1 / 3; width:66px; height:70px; border-radius:25px 25px 25px 10px; box-shadow:0 6px 0 rgba(35,30,104,.42),0 14px 22px rgba(0,0,0,.31),inset 0 2px 1px rgba(255,255,255,.43),inset 0 -7px 11px rgba(22,18,78,.25); }
.nearby .room-category-orbit::before { inset:8px; border-radius:18px 18px 18px 7px; }.nearby .room-category-orbit::after { width:86px; height:86px; }
.nearby .room-category-hero .room-category-orbit .material-icons { font-size:35px; }
.nearby .room-category-hero .room-category-name { align-self:end; font-size:9px; letter-spacing:.12em; }
.nearby .room-hero-name { align-self:start; margin-top:5px; font-size:clamp(20px,5.6vw,27px); line-height:1.02; }
.nearby .room-hero-hint { display:none; }
.nearby .room-user-preview { margin-top:8px; }

/* Alternative direction: an editorial night-pass, deliberately flatter than the playful 3D treatment. */
.nearby .room-category-hero { grid-template-columns:58px minmax(0,1fr); grid-template-rows:24px minmax(0,1fr); height:108px; padding:16px 18px; border:1px solid rgba(231,226,248,.12); border-radius:16px; background:linear-gradient(112deg,rgba(35,37,55,.98),rgba(24,26,39,.98)); box-shadow:0 13px 25px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.05); transform:none; }
.nearby .room-category-hero::before { top:15px; right:auto; bottom:15px; left:0; width:3px; height:auto; border:0; border-radius:0 3px 3px 0; background:linear-gradient(#b39aff,#6dc6eb); box-shadow:0 0 15px rgba(139,116,246,.45); animation:none; }
.nearby .room-category-hero::after { display:none; }
.nearby .room-category-hero .room-category-orbit { grid-row:1 / 3; width:42px; height:42px; border:1px solid rgba(224,216,255,.24); border-radius:50%; background:rgba(255,255,255,.045); box-shadow:inset 0 1px 0 rgba(255,255,255,.13); transform:none; animation:none; }
.nearby .room-category-orbit::before { inset:7px; border:1px solid rgba(193,179,255,.18); border-radius:50%; background:transparent; box-shadow:none; }.nearby .room-category-orbit::after { display:none; }
.nearby .room-category-hero .room-category-orbit .material-icons { font-size:22px; transform:none; filter:none; }
.nearby .room-category-hero .room-category-name { align-self:center; color:#bfb6d9; font-size:8px; letter-spacing:.16em; }
.nearby .room-hero-name { align-self:start; margin-top:4px; color:#f8f7fb; font-size:clamp(20px,5.4vw,26px); font-weight:720; letter-spacing:-.025em; line-height:1; text-shadow:none; }

/* Category-aware location card: the category itself chooses the accent, not a generic app gradient. */
.nearby .room-category-hero { --lup-place-accent:#9a85ec; --lup-place-glow:rgba(154,133,236,.22); grid-template-columns:64px minmax(0,1fr); grid-template-rows:22px minmax(0,1fr); height:118px; padding:17px 19px; border-color:color-mix(in srgb,var(--lup-place-accent) 38%,transparent); border-radius:19px; background:linear-gradient(112deg,color-mix(in srgb,var(--lup-place-accent) 18%,#202231),#191b29 68%); box-shadow:0 16px 29px rgba(0,0,0,.27),0 0 25px var(--lup-place-glow),inset 0 1px 0 rgba(255,255,255,.08); }
.nearby .room-category-hero.category-bar,.nearby .room-category-hero.category-pub,.nearby .room-category-hero.category-food { --lup-place-accent:#ed9466; --lup-place-glow:rgba(237,148,102,.20); }.nearby .room-category-hero.category-cafe { --lup-place-accent:#d2a576; --lup-place-glow:rgba(210,165,118,.18); }.nearby .room-category-hero.category-club { --lup-place-accent:#df79db; --lup-place-glow:rgba(223,121,219,.22); }.nearby .room-category-hero.category-culture { --lup-place-accent:#74b9e9; --lup-place-glow:rgba(116,185,233,.20); }.nearby .room-category-hero.category-community,.nearby .room-category-hero.category-university { --lup-place-accent:#82cce0; --lup-place-glow:rgba(130,204,224,.18); }.nearby .room-category-hero.category-health { --lup-place-accent:#ed8ba7; --lup-place-glow:rgba(237,139,167,.20); }.nearby .room-category-hero.category-city,.nearby .room-category-hero.category-town { --lup-place-accent:#9aaed4; --lup-place-glow:rgba(154,174,212,.16); }.nearby .room-category-hero.category-sport { --lup-place-accent:#74c89b; --lup-place-glow:rgba(116,200,155,.18); }.nearby .room-category-hero.category-outdoors { --lup-place-accent:#8fcb8a; --lup-place-glow:rgba(143,203,138,.18); }.nearby .room-category-hero.category-default,.nearby .room-category-hero.category-business,.nearby .room-category-hero.category-shop,.nearby .room-category-hero.category-salon,.nearby .room-category-hero.category-hotel { --lup-place-accent:#aaaac5; --lup-place-glow:rgba(170,170,197,.15); }
.nearby .room-category-hero::before { background:linear-gradient(var(--lup-place-accent),transparent); box-shadow:0 0 16px var(--lup-place-glow); }.nearby .room-category-hero .room-category-orbit { width:45px; height:45px; border-color:color-mix(in srgb,var(--lup-place-accent) 60%,rgba(255,255,255,.16)); background:color-mix(in srgb,var(--lup-place-accent) 20%,rgba(255,255,255,.04)); box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 8px 17px rgba(0,0,0,.17); }.nearby .room-category-hero .room-category-orbit .material-icons { color:var(--lup-place-accent); }.nearby .room-category-hero .room-category-name { color:color-mix(in srgb,var(--lup-place-accent) 72%,#fff); }.nearby .room-hero-name { font-size:clamp(21px,5.7vw,28px); }
.nearby .roominfo { min-height:450px; }.nearby .distrat .location-cuddles { top:85px; }.nearby .distrat .distance { top:86px; }

/* Presence becomes a small live signal between the location identity and its actions. */
.nearby .room-user-preview { position:relative; top:31px; display:flex; min-height:40px; margin-right:20px; margin-left:20px; padding:6px 10px 6px 12px; border:1px solid rgba(143,225,190,.16); border-radius:13px; background:linear-gradient(90deg,rgba(70,183,133,.14),rgba(255,255,255,.025) 64%,transparent); box-shadow:inset 3px 0 0 #62d3a0,inset 0 1px 0 rgba(255,255,255,.07); }
.nearby .room-user-preview .lup-avatar { border-color:#222b39; }.nearby .room-presence-count { padding:5px 8px; border-color:rgba(104,218,166,.25); background:rgba(79,196,140,.11); color:#b8f0d4; box-shadow:none; font-size:10px; }.nearby .room-presence-count .material-icons { color:#7be0ac; }

/* Nearby people: compact visual weight, larger faces, no stretched banner. */
.nearby .room-user-preview { top:35px; min-height:58px; margin:8px 30px 0 14px; padding:8px 12px; border:1px solid rgba(129,227,181,.18); border-radius:18px; background:linear-gradient(110deg,rgba(60,168,122,.17),rgba(51,64,94,.20) 62%,rgba(255,255,255,.025)); box-shadow:0 10px 22px rgba(0,0,0,.14),inset 3px 0 0 #69d9a4,inset 0 1px 0 rgba(255,255,255,.09); }
.nearby .room-user-preview .lup-avatar { width:42px; height:42px; margin-left:-12px; border:3px solid #202838; box-shadow:0 5px 12px rgba(0,0,0,.26); }.nearby .room-user-preview .lup-avatar:first-child { margin-left:0; }.nearby .room-user-preview .lup-avatar img { width:42px; height:42px; }
.nearby .room-user-preview .more-users { flex-basis:42px; width:42px; height:42px; margin-left:-10px; border:3px solid #202838; background:linear-gradient(145deg,#70d8ad,#4c86c5); }.nearby .room-user-preview .more-users b { line-height:36px; font-size:11px; }
.nearby .room-presence-count { margin-left:auto; padding:6px 9px; border-radius:12px; background:rgba(13,37,34,.37); color:#caf7df; font-size:10px; }
.nearby .chatbutton button { border-color:rgba(226,220,255,.34); background:linear-gradient(135deg,rgba(176,157,255,.52),rgba(91,165,220,.36)); box-shadow:0 7px 18px rgba(26,35,86,.22),inset 0 1px 0 rgba(255,255,255,.38),inset 0 -1px 0 rgba(255,255,255,.08); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }

/* The category seal leads the card with enough presence to be recognised at a glance. */
.nearby .room-category-hero .room-category-orbit { width:68px; height:68px; border:1px solid color-mix(in srgb,var(--lup-place-accent) 70%,#fff); border-radius:24px 24px 24px 9px; background:radial-gradient(circle at 29% 24%,rgba(255,255,255,.52) 0 7%,transparent 8% 100%),linear-gradient(145deg,color-mix(in srgb,var(--lup-place-accent) 52%,#fff),color-mix(in srgb,var(--lup-place-accent) 74%,#253261)); box-shadow:0 10px 21px rgba(0,0,0,.25),0 0 20px var(--lup-place-glow),inset 0 2px 1px rgba(255,255,255,.48),inset 0 -7px 12px rgba(12,15,42,.19); }.nearby .room-category-orbit::before { inset:9px; border:1px solid rgba(255,255,255,.24); border-radius:18px 18px 18px 7px; background:rgba(13,18,51,.10); }.nearby .room-category-hero .room-category-orbit .material-icons { position:relative; z-index:1; color:#fff; font-size:36px; filter:drop-shadow(0 2px 0 rgba(24,29,72,.30)); }.nearby .room-category-hero .room-category-name { font-weight:900; text-shadow:0 0 12px var(--lup-place-glow); }
@media (max-width:600px) { .nearby .room-category-hero { grid-template-columns:84px minmax(0,1fr); }.nearby .room-category-hero .room-category-orbit { width:64px; height:64px; }.nearby .room-category-hero .room-category-orbit .material-icons { font-size:34px; } }

/* The category is the location's visual anchor again: larger than a label, smaller than a billboard. */
.nearby .roominfo { min-height:494px; }.nearby .room-category-hero { grid-template-columns:86px minmax(0,1fr); grid-template-rows:28px minmax(0,1fr); height:154px; margin-top:20px; padding:21px 22px 20px; border-radius:22px; }.nearby .room-category-hero::before { top:19px; bottom:19px; width:4px; }.nearby .room-category-hero .room-category-orbit { width:64px; height:64px; border-width:1px; box-shadow:inset 0 1px 0 rgba(255,255,255,.20),0 11px 22px rgba(0,0,0,.22); }.nearby .room-category-orbit::before { inset:10px; }.nearby .room-category-hero .room-category-orbit .material-icons { font-size:34px; }.nearby .room-category-hero .room-category-name { font-size:9px; letter-spacing:.18em; }.nearby .room-hero-name { margin-top:7px; font-size:clamp(25px,6.7vw,33px); line-height:.98; }

/* Compact category filters echo the same category colours, without toy-like icon boxes. */
.location-categories { gap:3px; padding:6px 7px; border-color:rgba(255,255,255,.07); background:rgba(255,255,255,.025); box-shadow:inset 0 1px 0 rgba(255,255,255,.05); }.location-categories button { min-height:47px; padding:5px 1px; border-radius:9px; background:transparent; box-shadow:none; }.location-categories button .material-icons { width:auto; height:22px; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; font-size:21px; line-height:22px; transform:none; opacity:.88; }.location-categories button span { margin-top:3px; font-size:7px; font-weight:800; letter-spacing:.015em; }.location-categories button.active { border-color:rgba(255,255,255,.12); background:rgba(255,255,255,.06); }.location-categories button.active::after { bottom:3px; width:11px; background:#d9d1ff; box-shadow:0 0 7px rgba(197,181,255,.55); }.location-categories button:nth-child(1) .material-icons { color:#b7a3ff; }.location-categories button:nth-child(2) .material-icons { color:#9db7df; }.location-categories button:nth-child(3) .material-icons { color:#e2af83; }.location-categories button:nth-child(4) .material-icons { color:#d99ad7; }.location-categories button:nth-child(5) .material-icons { color:#9dd5df; }.location-categories button:nth-child(6) .material-icons { color:#d4a9b7; }

/* Phone rhythm: compact, touchable, and deliberately free of dead vertical space. */
@media (max-width:600px) {
  .location-categories { margin-bottom:0; }
  .nearby .roominfo { min-height:432px; margin-top:-8px; }
  .nearby .room-category-hero { height:136px; margin-top:4px; padding:17px 18px; grid-template-columns:76px minmax(0,1fr); }
  .nearby .room-category-hero .room-category-orbit { width:56px; height:56px; }
  .nearby .room-category-hero .room-category-orbit .material-icons { font-size:30px; }
  .nearby .room-hero-name { margin-top:5px; font-size:clamp(23px,6.4vw,29px); }
  .nearby .room-user-preview { top:28px; margin-top:5px; margin-right:8px; margin-left:27px; }
  .nearby .distrat { top:18px; }
  .nearby .distrat .location-cuddles { top:106px; }
  .nearby .distrat .distance { top:107px; }
  .nearby .distrat .location-cuddles { width:64px; height:64px; border-radius:21px 21px 21px 10px; box-shadow:0 6px 13px rgba(105,40,89,.27),0 17px 27px rgba(0,0,0,.24),0 0 25px rgba(231,103,156,.20),inset 0 2px 1px rgba(255,255,255,.46); }
  .nearby .distrat .location-cuddles > .material-icons { font-size:37px; }.nearby .distrat .location-cuddles strong { right:-10px; bottom:-10px; min-width:25px; height:25px; font-size:11px; }
  .nearby .distrat .distance a { gap:4px; font-size:11px; }.nearby .distrat .distance a::before { width:64px; height:64px; border-radius:50% 50% 50% 17px; font-size:35px; box-shadow:0 6px 13px rgba(32,72,137,.28),0 18px 28px rgba(0,0,0,.24),0 0 0 7px rgba(93,190,228,.08),0 0 25px rgba(91,195,235,.20),inset 0 2px 1px rgba(255,255,255,.46); }
  .nearby .distrat .distance a::after { content:none; }
  .nearby .chatbutton { margin-top:8px; }
}

/* The QR check-in and route marker belong to the lower edge of the place
   card, not to a height-dependent flow position.  Anchor the pair so changing
   between phone and wide-screen views cannot make either mark jump upward. */
.nearby .roominfo { position:relative; }
.nearby .roominfo .distrat {
  position:absolute;
  top:auto;
  right:auto;
  bottom:24px;
  left:50%;
  width:auto;
  margin:0;
  transform:translateX(-50%);
}
.nearby .roominfo .distrat .location-cuddles,
.nearby .roominfo .distrat .distance {
  top:auto;
  right:auto;
  bottom:auto;
  left:auto;
  transform:none;
}

/* Profile: About and Gallery are plain adjacent labels.  Angular Material can
   recreate its ink runner after a tab change, so suppress both the runner and
   the old divider at the final cascade level. */
.profile-page .information-tabs .md-ink-bar,
.profile-page .information-tabs [class*="ink-bar"] {
  display:none;
  visibility:hidden;
}

/* Final location-action contract: QR is a square scan surface, route is a
   true circle. Both counters use the same small, readable floating badge. */
.nearby .roominfo .distrat .location-cuddles {
  width:60px;
  min-width:60px;
  height:60px;
  border-radius:14px;
}
.nearby .roominfo .distrat .distance,
.nearby .roominfo .distrat .distance p,
.nearby .roominfo .distrat .distance a {
  width:60px;
  min-width:60px;
  height:60px;
  margin:0;
}
.nearby .roominfo .distrat .distance a {
  position:relative;
  display:grid;
  place-items:center;
  border-radius:50%;
}
.nearby .roominfo .distrat .distance a > .material-icons {
  display:grid;
  place-items:center;
  width:60px;
  height:60px;
  border-radius:50%;
  box-sizing:border-box;
}
.nearby .roominfo .distrat .location-cuddles strong,
.nearby .roominfo .distrat .distance a > span {
  display:grid;
  place-items:center;
  min-width:18px;
  height:18px;
  padding:0 4px;
  border:1px solid rgba(255,255,255,.62);
  border-radius:999px;
  background:rgba(247,246,255,.90);
  color:#464257;
  box-shadow:0 2px 7px rgba(0,0,0,.24);
  font-size:8px;
  font-weight:850;
  line-height:1;
}
.profile-page .information-tabs md-tabs-canvas,
.profile-page .information-tabs md-pagination-wrapper,
.profile-page .information-tabs md-tabs-wrapper,
.profile-page .information-tabs md-tab-item:first-child {
  border-color:transparent;
  border-right-color:transparent;
}
.nearby .roominfo .distrat .location-cuddles,
.nearby .roominfo .distrat .distance { align-self:flex-start; }
.nearby .roominfo .distrat .distance a > .material-icons {
  margin-top:9px;
  margin-left:14px;
}
.nearby .roominfo .distrat { gap:54px; }
.nearby .roominfo .distrat .distance { transform:translateY(45px); }

/* A 600×900 preview is still a phone/tablet portrait layout.  Keep its card
   geometry identical to the compact view instead of switching abruptly into
   the wide desktop measurements at 601px. */
@media (min-width:601px) and (max-width:900px) {
  .nearby .roominfo { min-height:432px; margin-top:-8px; }
  .nearby .room-category-hero {
    height:136px;
    margin-top:4px;
    padding:17px 18px;
    grid-template-columns:76px minmax(0,1fr);
  }
  .nearby .room-category-hero .room-category-orbit { width:56px; height:56px; }
  .nearby .room-category-hero .room-category-orbit .material-icons { font-size:30px; }
  .nearby .room-user-preview { top:28px; margin-top:5px; margin-right:8px; margin-left:27px; }
  .nearby .roominfo .distrat { bottom:24px; }
}
.nearby .roominfo .distrat .location-cuddles:hover { transform:none; }

/* A Cuddle is a real-world check-in, not an action that silently joins a chatroom. */
.lup-location-cuddle-dialog { width:min(90vw,360px); overflow:hidden; border:1px solid rgba(215,201,255,.19); border-radius:25px; background:radial-gradient(circle at 50% -8%,rgba(155,124,255,.34),transparent 43%),linear-gradient(150deg,#302b4c,#171923); }
.lup-location-cuddle-content { position:relative; padding:27px 24px 23px; text-align:center; }.lup-location-cuddle-close { position:absolute; top:10px; right:10px; display:grid; place-items:center; width:32px; height:32px; padding:0; border:0; border-radius:50%; background:rgba(255,255,255,.08); color:#eee9f9; cursor:pointer; }.lup-location-cuddle-seal { display:grid; place-items:center; width:61px; height:61px; margin:0 auto 11px; border:1px solid rgba(236,228,255,.35); border-radius:20px 20px 20px 8px; background:linear-gradient(145deg,#b69fff,#6579dd); box-shadow:0 8px 0 rgba(48,42,111,.48),0 18px 29px rgba(0,0,0,.30),inset 0 2px 1px rgba(255,255,255,.43); color:#fff; }.lup-location-cuddle-seal .material-icons { font-size:34px; }.lup-location-cuddle-eyebrow { color:#cbbdff; font-size:9px; font-weight:900; letter-spacing:.15em; }.lup-location-cuddle-content h2 { margin:5px 0 9px; color:#fff; font-size:21px; line-height:1.15; }.lup-location-cuddle-content p { margin:0 auto; color:#d7d0e8; font-size:13px; line-height:1.48; }.lup-location-cuddle-rule { display:flex; align-items:center; gap:8px; margin:17px 0 11px; padding:10px 12px; border:1px solid rgba(196,177,255,.19); border-radius:13px; background:rgba(124,96,226,.14); color:#eee8ff; font-size:11px; font-weight:750; text-align:left; }.lup-location-cuddle-rule .material-icons { color:#aee8c8; font-size:18px; }.lup-location-cuddle-content .lup-location-cuddle-note { color:#aea6c4; font-size:11px; }.lup-location-cuddle-done { width:100%; margin-top:18px; padding:12px 16px; border:1px solid rgba(226,217,255,.27); border-radius:13px; background:linear-gradient(145deg,#9c84ed,#6173ce); box-shadow:0 5px 0 rgba(47,41,107,.43),0 11px 18px rgba(0,0,0,.21),inset 0 1px 0 rgba(255,255,255,.35); color:#fff; font:800 12px inherit; cursor:pointer; }

/* The original centred chat entry gets only a calmer colour and a shallow physical depth. */
.nearby .chatbutton { display:block; width:min(100%,390px); margin:7px auto 0; }
.nearby .chatbutton button { float:left; width:100%; height:60px; min-height:60px; padding:0; border:1px solid rgba(205,195,255,.22); border-radius:20px; background:linear-gradient(145deg,#6251a9,#394c91); box-shadow:0 7px 0 rgba(31,34,81,.45),0 15px 24px rgba(0,0,0,.23),inset 0 1px 0 rgba(255,255,255,.23); color:#fff; }
.nearby .chatbutton button:not(.inactive)::before { display:none; }
.nearby .chatbutton.chatbutton--locked { width:min(72%,275px); margin-top:10px; }
.nearby .chatbutton.chatbutton--locked button { float:none; width:100%; height:36px; min-height:36px; border-radius:999px; background:rgba(30,29,48,.50); box-shadow:none; }
/* Personal profile emblems are compact 3D badges, not flat coloured outlines. */
.profile-page .profile-information .profile-detail-card h5 .material-icons { position:relative; overflow:hidden; border-color:rgba(255,255,255,.48); background:linear-gradient(145deg,#b4a3ff 0%,#7654df 38%,#3d4cae 100%); box-shadow:0 6px 0 rgba(48,35,117,.58),0 11px 17px rgba(0,0,0,.28),inset 0 2px 1px rgba(255,255,255,.48),inset 0 -5px 8px rgba(27,20,87,.22); text-shadow:0 2px 0 rgba(43,31,111,.55); transform:translateY(-2px); }
.profile-page .profile-information .profile-detail-card h5 .material-icons::after { content:''; position:absolute; top:2px; left:5px; right:5px; height:40%; border-radius:10px; background:linear-gradient(180deg,rgba(255,255,255,.32),transparent); pointer-events:none; }
.profile-page .profile-information .profile-detail-card:nth-child(3n) h5 .material-icons { background:linear-gradient(145deg,#9ce5ff 0%,#3ba9e7 38%,#3c5fb8 100%); box-shadow:0 6px 0 rgba(33,76,147,.55),0 11px 17px rgba(0,0,0,.28),inset 0 2px 1px rgba(255,255,255,.48),inset 0 -5px 8px rgba(24,59,119,.22); }
.profile-page .profile-information .profile-detail-card:nth-child(4n) h5 .material-icons { background:linear-gradient(145deg,#ffd48c 0%,#e89b51 38%,#a64782 100%); box-shadow:0 6px 0 rgba(131,49,94,.55),0 11px 17px rgba(0,0,0,.28),inset 0 2px 1px rgba(255,255,255,.48),inset 0 -5px 8px rgba(111,36,77,.22); }

/* Sidebar as a compact LinkUUp control room. */
.md-sidenav-left { border-right: 1px solid rgba(255,255,255,.10); background: #161724; box-shadow: 17px 0 38px rgba(0,0,0,.28); }
.md-sidenav-left .sidenav-brand { position: relative; overflow: hidden; min-height: 84px; background: linear-gradient(135deg,#252447 0%,#332664 55%,#1c3158 100%); border-bottom: 1px solid rgba(255,255,255,.12); }
.md-sidenav-left .sidenav-brand::before { content:''; position:absolute; width:150px; height:150px; right:-49px; top:-83px; border:1px solid rgba(255,255,255,.16); border-radius:50%; box-shadow:0 0 0 18px rgba(255,255,255,.035),0 0 0 37px rgba(255,255,255,.025); }
.md-sidenav-left .sidenav-brand .md-toolbar-tools { position:relative; z-index:1; height:84px; padding:0 17px; }.md-sidenav-left .sidenav-brand h1 { margin:0; color:#fff; font-size:25px; font-weight:800; letter-spacing:-.04em; }.md-sidenav-left .sidenav-brand span { display:block; margin-top:3px; color:#d8d1f1; font-size:10px; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }.md-sidenav-left .nav-close { display:grid; place-items:center; width:34px; height:34px; margin-right:10px; border:1px solid rgba(255,255,255,.17); border-radius:12px; background:rgba(255,255,255,.08); color:#fff; cursor:pointer; }
.md-sidenav-left md-content { background: radial-gradient(circle at 100% 0,rgba(118,87,222,.12),transparent 24%),#171923; }
.sidebar-user-card { position:relative; overflow:hidden; margin:13px 12px 7px; padding:12px; border-radius:17px; background:linear-gradient(135deg,rgba(126,95,231,.24),rgba(43,157,244,.10)); box-shadow:0 10px 25px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.09); transition:transform .2s ease,box-shadow .2s ease; }.sidebar-user-card::after { content:''; position:absolute; right:-25px; bottom:-38px; width:90px; height:90px; border-radius:50%; background:rgba(177,157,255,.13); filter:blur(2px); }.sidebar-user-card:hover { transform:translateY(-2px); box-shadow:0 14px 29px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.12); }.sidebar-user-card > * { position:relative; z-index:1; }.sidebar-user-card .lup-avatar { outline:2px solid rgba(196,180,255,.42); outline-offset:2px; }
.md-sidenav-left md-list { padding:5px 9px 17px; }.md-sidenav-left .sidebar-section-title { min-height:0; margin:14px 7px 5px; padding:0; background:transparent; color:#938cab; font-size:9px; font-weight:850; letter-spacing:.12em; line-height:18px; text-transform:uppercase; }.md-sidenav-left .sidebar-section-title:first-child { margin-top:8px; }.md-sidenav-left .sidebar-legal-title { margin-top:19px; border-top:1px solid rgba(255,255,255,.07); padding-top:12px; }
.md-sidenav-left md-list-item { min-height:47px; margin:3px 0; border-radius:13px; }.md-sidenav-left md-list-item .nav-icon { width:31px; height:31px; border-radius:11px; transition:transform .2s ease,box-shadow .2s ease; }.md-sidenav-left md-list-item:hover { transform:translateX(4px); }.md-sidenav-left md-list-item:hover .nav-icon { transform:rotate(-7deg) scale(1.08); box-shadow:0 6px 13px rgba(0,0,0,.20); }
.md-sidenav-left md-list-item.nav-discover { background:linear-gradient(90deg,rgba(122,92,255,.21),rgba(43,157,244,.055)); border-color:rgba(155,139,255,.19); }.md-sidenav-left md-list-item.nav-discover::before { background:#a996ff; box-shadow:0 0 12px #a996ff; }.md-sidenav-left md-list-item.nav-discover .nav-icon { background:linear-gradient(135deg,#876ef2,#669bef); color:#fff; }.md-sidenav-left md-list-item.nav-profile .nav-icon { background:rgba(99,188,247,.18); color:#9fdaff; }.md-sidenav-left md-list-item.nav-friends .nav-icon { background:rgba(241,123,189,.16); color:#ffaad7; }.md-sidenav-left md-list-item.nav-logout { margin-top:4px; border-color:rgba(255,255,255,.07); background:rgba(255,255,255,.025); }.md-sidenav-left md-list-item.nav-logout .nav-icon { background:rgba(255,117,146,.12); color:#ff9caf; }.md-sidenav-left md-list-item.nav-logout p { color:#e6c7ce; }

/* Location, chat and presence are one dark workspace at every screen size. */
.singlelocation md-content, .singlelocation .md-tab, .singlelocation .md-tab-content,
.singlelocation [layout="row"] > .ng-scope { background: var(--lup-bg); color: var(--lup-text); }
.singlelocation .usernavigation { background: var(--lup-surface); border-left: 1px solid var(--lup-line); }
.singlelocation .usernavigation md-list-item { color: var(--lup-text); }
.singlelocation .usernavigation .md-subheader { background: transparent; color: var(--lup-muted); }
.singlelocation .usernavigation .md-list-item-text p { color: var(--lup-text); }
.singlelocation .usernavigation .presence-person { background: rgba(255,255,255,.035); }
/* The Online tab can render outside .singlelocation on narrow screens. */
md-list.usernavigation,
md-list.usernavigation .md-subheader,
md-list.usernavigation .visitors-list {
  background: var(--lup-surface);
  color: var(--lup-text);
}
md-list.usernavigation md-list-item { color: var(--lup-text); }
md-list.usernavigation .md-list-item-text p { color: var(--lup-text); }
md-list.usernavigation .md-subheader-content,
md-list.usernavigation .md-list-item-inner .md-list-item-text .username,
md-list.usernavigation .presence-person-copy .username,
md-list.usernavigation .username {
  color: var(--lup-text);
}
md-list.usernavigation .md-list-item-inner { border-bottom-color: transparent; }
md-list.usernavigation .presence-person-copy p:last-child { color: var(--lup-muted); }
/* User names stay equally readable in Friends, Ups and Online lists. */
md-list .md-list-item-text .username,
.lup-likes .username,
.friends .username {
  color: var(--lup-text);
  font-weight: 700;
}

/* Friends are presented as people cards instead of a plain legacy list. */
.friends-page > md-content { background: radial-gradient(circle at 88% 0, rgba(122,92,255,.13), transparent 31%), var(--lup-bg); }
.friends-page .friends-list { width: min(94%, 720px); margin: 8px auto 28px; padding: 0; background: transparent; }
.friends-page .friends-list .md-subheader { margin: 8px 4px 10px; padding: 0; background: transparent; color: var(--lup-muted); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.friends-page .lup-user-list md-list-item,
.friends-page .search-input-wrap + md-list md-list-item { min-height: 72px; margin: 8px 0; padding: 8px 11px; border: 1px solid rgba(255,255,255,.09); border-radius: 16px; background: linear-gradient(135deg, rgba(122,92,255,.13), rgba(255,255,255,.035)); box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 8px 17px rgba(0,0,0,.13); transition: transform .18s ease, border-color .18s ease, background .18s ease; }
.friends-page .lup-user-list md-list-item:hover { transform: translateY(-2px); border-color: rgba(177,161,255,.42); background: linear-gradient(135deg, rgba(122,92,255,.22), rgba(43,157,244,.07)); }
.friends-page .lup-user-list lup-avatar { margin-right: 11px; }
.friends-page .lup-user-list .md-list-item-text { min-width: 0; }
.friends-page .lup-user-list .username { margin: 0 0 3px; color: var(--lup-text); font-size: 15px; font-weight: 750; }
.friends-page .lup-user-list .lup-user-status { margin: 0; overflow: hidden; color: var(--lup-muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.friends-page .lup-user-list .usericon { margin-left: 5px; border-radius: 50%; background-color: rgba(255,255,255,.08); background-position: center; }
.friends-page .lup-user-list .sendmessage { background-color: rgba(122,92,255,.30); }
.friends-page .search-input-wrap { display: flex; align-items: center; gap: 9px; width: min(94%, 720px); margin: 14px auto 5px; padding: 8px 11px; border: 1px solid rgba(255,255,255,.11); border-radius: 15px; background: rgba(255,255,255,.055); }
.friends-page .search-input-wrap .search-input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--lup-text); font: 600 14px Ubuntu, sans-serif; }
.friends-page .search-input-wrap .search-input::placeholder { color: var(--lup-muted); }
.friends-page .qrcode-dummy { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 11px; background: rgba(122,92,255,.22); color: #d9d1ff; cursor: pointer; }

/* Visited locations feel like a collection: readable, tactile and rewarding. */
.course-collection {
  max-width: 760px;
  margin: 0 auto;
  padding: 14px 12px 28px;
  background: transparent;
}
.course-collection .md-subheader {
  margin: 4px 4px 12px;
  padding: 0;
  background: transparent;
  color: var(--lup-muted);
  font-size: 12px;
  font-weight: 700;
}
.course-collection md-list-item.md-2-line {
  min-height: 82px;
  margin: 8px 0;
  padding: 8px 11px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 17px;
  background: linear-gradient(110deg, rgba(122,92,255,.13), rgba(255,255,255,.035));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.course-collection md-list-item.md-2-line:hover {
  transform: translateY(-2px);
  border-color: rgba(122,92,255,.48);
  background: linear-gradient(110deg, rgba(122,92,255,.23), rgba(43,157,244,.09));
}
.course-collection .md-avatar {
  width: 54px;
  height: 54px;
  margin-right: 13px;
  border: 2px solid rgba(255,255,255,.16);
  border-radius: 16px;
  object-fit: cover;
  box-shadow: 0 7px 16px rgba(0,0,0,.23);
  cursor: pointer;
}
.course-collection .md-list-item-text p {
  color: var(--lup-text);
  font-size: 14px;
  font-weight: 700;
}
.course-collection .md-list-item-text h5 {
  margin: 4px 0 0;
  color: var(--lup-muted);
  font-size: 11px;
  font-weight: 500;
}
.course-visit-badge {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 17px 15px 10px;
  justify-items: center;
  align-items: center;
  flex: 0 0 48px;
  width: 48px;
  height: 54px;
  margin: 0 12px 0 0;
  padding: 4px 0;
  border: 1px solid rgba(246,198,90,.46);
  border-radius: 16px 16px 19px 19px;
  background:
    radial-gradient(circle at 50% 0, rgba(255,244,190,.28), transparent 44%),
    linear-gradient(155deg, rgba(246,198,90,.34), rgba(126,84,29,.28));
  box-shadow: 0 7px 15px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.24);
  color: #fff1bd;
  text-align: center;
}
.course-visit-badge::after { content: ''; position: absolute; right: 7px; bottom: 6px; width: 5px; height: 5px; border-radius: 50%; background: #fff0a5; box-shadow: 0 0 8px rgba(255,229,119,.90); }
.course-visit-badge .material-icons { font-size: 18px; color: #fff1a4; filter: drop-shadow(0 1px 2px rgba(67,38,3,.55)); }
.course-visit-badge strong { font-size: 15px; line-height: 1; text-shadow: 0 1px 2px rgba(67,38,3,.60); }
.course-visit-badge span { font-size: 7px; color: #ffedaf; text-transform: uppercase; letter-spacing: .06em; }

/* Avatar upload keeps the exact same visual centre as an ordinary profile avatar. */
.profile-page .avatar-bg { display: flex; flex-direction: column; align-items: center; }
.profile-page .avatar-bg { position: relative; overflow: visible; isolation: isolate; }
.profile-page .avatar-bg .avatar { display: flex; justify-content: center; align-items: center; width: 100%; position: relative; z-index: 2; overflow: visible; }
.profile-page .avatar-bg .avatar > div { display: flex; justify-content: center; align-items: center; position: relative; }
.profile-page .avatar-bg .large-avatar { display: block; margin: 0 auto; position: relative; z-index: 3; }
.profile-page .avatar-bg .profile-identity { position: relative; z-index: 2; }

.profile-page .large-avatar img { width: 132px; height: 132px; border-radius: 50%; object-fit: cover; }

/* The built-in profile tabs remain visible and clickable. */
.profile-page .user-profile-page { position: relative; }
.profile-section-sidebar { position: relative; z-index: 12; display: flex; justify-content: center; align-items: flex-start; gap: 8px; margin: 16px auto 10px; }
.profile-sidebar-toggle { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid rgba(255,255,255,.16); border-radius: 15px; background: linear-gradient(145deg, rgba(122,92,255,.88), rgba(43,157,244,.62)); color: #fff; box-shadow: 0 10px 24px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.20); cursor: pointer; }
.profile-sidebar-toggle .material-icons { font-size: 22px; transition: transform .2s ease; }
.profile-section-sidebar.open .profile-sidebar-toggle .material-icons { transform: rotate(90deg); }
.profile-section-switcher { display: flex; flex-direction: column; gap: 7px; width: 0; max-height: 0; padding: 0; overflow: hidden; opacity: 0; transform: translateX(12px) scale(.94); pointer-events: none; border: 1px solid transparent; border-radius: 18px; background: rgba(25,28,42,.96); box-shadow: 0 18px 40px rgba(0,0,0,.34); transition: width .22s ease, max-height .22s ease, padding .22s ease, opacity .16s ease, transform .22s ease; }
.profile-section-sidebar.open .profile-section-switcher { width: 150px; max-height: 190px; padding: 11px; opacity: 1; transform: none; pointer-events: auto; border-color: rgba(255,255,255,.12); }
.profile-switcher-title { margin: 1px 4px 5px; color: var(--lup-muted); font: 800 10px/1 Ubuntu, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.profile-section-switcher button { display: flex; align-items: center; gap: 9px; width: 100%; padding: 11px 10px; border: 1px solid transparent; border-radius: 12px; background: rgba(255,255,255,.045); color: var(--lup-muted); font: 700 12px/1 Ubuntu, sans-serif; text-align: left; cursor: pointer; }
.profile-section-switcher button .material-icons { font-size: 19px; }
.profile-section-switcher button.active { border-color: rgba(122,92,255,.55); background: linear-gradient(135deg, rgba(122,92,255,.30), rgba(43,157,244,.18)); color: var(--lup-text); box-shadow: inset 0 1px 0 rgba(255,255,255,.12); }
.profile-page .gallery-upload { display: contents; }
.profile-page .gallery-upload-button { display: none; }
.profile-page .gallery-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 8px 12px 28px; }
.profile-page .gallery-tile { aspect-ratio: 1 / .82; display: block; overflow: hidden; padding: 0; border: 1px solid rgba(255,255,255,.12); border-radius: 15px; background: rgba(255,255,255,.05); box-shadow: 0 8px 18px rgba(0,0,0,.18); cursor: pointer; }
.profile-page .gallery-tile img { display: block; width: 100%; height: 100%; object-fit: cover; }
.profile-page .gallery-tile:hover { border-color: rgba(176,160,255,.75); transform: translateY(-1px); }
.profile-page .gallery-add-tile { aspect-ratio: 1 / .82; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; overflow:hidden; padding:0; border:1px dashed rgba(186,170,255,.55); border-radius:15px; background:linear-gradient(145deg,rgba(126,94,233,.20),rgba(43,157,244,.09)); color:#e9e4ff; box-shadow:inset 0 1px 0 rgba(255,255,255,.11); font:700 12px/1.15 Ubuntu,sans-serif; cursor:pointer; }
.profile-page .gallery-add-tile .material-icons { display:grid; place-items:center; width:39px; height:39px; border-radius:50%; background:linear-gradient(145deg,#aa92ff,#5f7ee7); color:#fff; box-shadow:0 6px 14px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.30); font-size:25px; }
.profile-page .gallery-add-tile:hover { border-color:#dacfff; background:linear-gradient(145deg,rgba(142,108,250,.34),rgba(63,177,245,.18)); transform:translateY(-1px); }
.profile-page .cuddle-qr-trigger { position: absolute; top: 3px; left: 50%; width: 24px; height: 24px; transform: translateX(-50%); display: grid; place-items: center; padding: 0; border: 1px solid rgba(255,255,255,.20); border-radius: 50%; background: rgba(255,117,146,.26); color: #ffd5df; cursor: pointer; z-index: 2; }
.profile-page .cuddle-qr-trigger .material-icons { margin: 0; color: inherit; font-size: 15px; }
.profile-contact-actions { display: flex; justify-content: center; gap: 8px; margin: 12px auto 0; }
.profile-contact-actions button { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 7px 10px; border: 1px solid var(--lup-line); border-radius: 11px; background: rgba(255,255,255,.045); color: var(--lup-text); font: 700 11px/1 Ubuntu, sans-serif; cursor: pointer; }
.profile-contact-actions button:hover { background: rgba(122,92,255,.22); border-color: rgba(122,92,255,.48); }
.profile-contact-actions .usericon { width: 18px; height: 18px; background-size: 18px; }

/* Real-time presence: people and actions form one compact, tactile card. */
.location-presence-heading {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 12px 12px 8px;
  padding: 12px;
  border: 1px solid var(--lup-line);
  border-radius: 14px;
  background: rgba(255,255,255,.045);
  color: var(--lup-text);
}
.location-presence-heading > .material-icons { color: #55d69a; font-size: 23px; }
.location-presence-heading strong, .location-presence-heading span { display: block; }
.location-presence-heading strong { font-size: 13px; }
.location-presence-heading span { margin-top: 2px; color: var(--lup-muted); font-size: 11px; text-transform: none; letter-spacing: 0; }
.visitors-list { padding: 0 12px 14px; }
.presence-person.md-2-line {
  min-height: 68px;
  margin: 7px 0;
  padding: 7px 9px;
  border: 1px solid var(--lup-line);
  border-radius: 16px;
  background: rgba(255,255,255,.035);
}
.presence-person .presence-avatar { position: relative; margin-right: 10px; }
.presence-person .presence-avatar::after { content: ''; position: absolute; right: 0; bottom: 1px; width: 10px; height: 10px; border: 2px solid var(--lup-surface); border-radius: 50%; background: #55d69a; box-shadow: 0 0 10px rgba(85,214,154,.72); }
.presence-person-copy .username { color: var(--lup-text); font-weight: 700; }
.presence-person-copy p:last-child { color: var(--lup-muted); font-size: 12px; }
.presence-actions { display: flex; align-items: center; gap: 2px; }
.presence-actions .usericon { width: 28px; height: 28px; padding: 5px; border-radius: 50%; background-color: rgba(255,255,255,.07); background-size: 17px; background-position: center; }
.presence-actions .sendmessage { background-color: rgba(122,92,255,.26); }
.presence-person:first-child { border-color: rgba(122,92,255,.38); background: linear-gradient(100deg, rgba(122,92,255,.13), rgba(43,157,244,.05)); }

/* Navigation gets the same layers and hierarchy as the app content. */
.md-sidenav-left md-content { background: #171923; }
.sidebar-user-card {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 12px 10px 2px;
  padding: 11px;
  border: 1px solid var(--lup-line);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(122,92,255,.18), rgba(43,157,244,.10));
  cursor: pointer;
}
.sidebar-user-card .lup-avatar { flex: 0 0 auto; }
.sidebar-user-card div { min-width: 0; flex: 1; }
.sidebar-user-card strong, .sidebar-user-card span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-user-card strong { color: var(--lup-text); font-size: 13px; }
.sidebar-user-card span { color: var(--lup-muted); margin-top: 2px; font-size: 11px; }
.sidebar-user-card > .material-icons { color: #c9c3ff; }
.md-sidenav-left md-list-item:hover { transform: translateX(2px); }
.md-sidenav-left md-list-item { transition: transform .18s ease, background .18s ease; }

/* Sidebar settings get a gentle visual hierarchy without changing navigation. */
.md-sidenav-left md-list { padding-top: 14px; }
.md-sidenav-left md-list-item { position: relative; overflow: hidden; min-height: 50px; border: 1px solid transparent; background: transparent; }
.md-sidenav-left md-list-item::before { content: ''; position: absolute; left: 0; top: 10px; bottom: 10px; width: 3px; border-radius: 0 5px 5px 0; background: transparent; transition: background .18s ease, box-shadow .18s ease; }
.md-sidenav-left md-list-item p { color: #e8e5f3; font-size: 14px; font-weight: 650; }
.md-sidenav-left md-list-item .nav-icon { display: grid; place-items: center; width: 30px; height: 30px; margin-right: 11px; border-radius: 10px; background: rgba(255,255,255,.055); color: #c9c3ff; font-size: 18px; }
.md-sidenav-left md-list-item:hover { border-color: rgba(255,255,255,.08); background: linear-gradient(90deg, rgba(122,92,255,.19), rgba(43,157,244,.04)); }
.md-sidenav-left md-list-item:hover::before { background: #b8a9ff; box-shadow: 0 0 13px #b8a9ff; }
.md-sidenav-left md-list-item.nav-settings { background: linear-gradient(90deg, rgba(122,92,255,.18), rgba(122,92,255,.035)); border-color: rgba(159,142,255,.22); }
.md-sidenav-left md-list-item.nav-settings::before { background: #b8a9ff; box-shadow: 0 0 12px #b8a9ff; }
.md-sidenav-left md-list-item.nav-settings .nav-icon { background: rgba(122,92,255,.28); color: #ded8ff; }
.md-sidenav-left md-list-item.nav-account .nav-icon { background: rgba(43,157,244,.18); color: #a7d9ff; }
.md-sidenav-left md-list-item.nav-profile-settings .nav-icon { background: rgba(246,198,90,.16); color: #ffe09a; }
.md-sidenav-left .md-subheader { border-bottom: 1px solid rgba(255,255,255,.07); padding-bottom: 8px; }

/* Profile counters are compact destination cards, not bare numbers. */
.profile-page .user-top-information { position: relative; isolation: isolate; overflow: hidden; background: linear-gradient(145deg, rgba(39,43,65,.98), rgba(22,25,38,.98)); border: 1px solid rgba(255,255,255,.055); box-shadow: 0 16px 38px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.055); }
.profile-page .user-top-information::before { content: ''; position: absolute; z-index: 0; inset: 0; background: radial-gradient(circle at 9% 0%, rgba(122,92,255,.30), transparent 38%), radial-gradient(circle at 92% 100%, rgba(43,157,244,.19), transparent 42%); pointer-events: none; }
.profile-page .user-top-information .countitems { position: relative; z-index: 1; gap: 8px; padding: 0 10px 11px; box-sizing: border-box; }
.profile-page .user-top-information .countitem { position: relative; isolation: isolate; overflow: hidden; min-height: 76px; margin: 0; padding: 10px 4px 8px; border: 1px solid rgba(255,255,255,.065); border-radius: 15px; background: rgba(255,255,255,.048); box-shadow: inset 0 1px 0 rgba(255,255,255,.07); cursor: pointer; transition: transform .20s ease, background .20s ease, border-color .20s ease, box-shadow .20s ease; }
.profile-page .user-top-information .countitem::before { content: ''; position: absolute; top: 0; left: 18%; right: 18%; height: 3px; border-radius: 0 0 999px 999px; background: #c9c3ff; box-shadow: 0 0 11px currentColor; opacity: .9; }
.profile-page .user-top-information .countitem::after { content: ''; position: absolute; z-index: -1; top: -26px; left: 50%; width: 68px; height: 56px; transform: translateX(-50%); border-radius: 50%; background: currentColor; opacity: .09; filter: blur(13px); }
.profile-page .user-top-information .countitem:hover { transform: translateY(-3px); border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.085); box-shadow: 0 10px 18px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.13); }
.profile-page .user-top-information .countitem .material-icons { display: block; margin-bottom: 2px; font-size: 17px; color: #c9c3ff; }
.profile-page .user-top-information .countitem.stat-ups .material-icons { color: #f6c65a; }
.profile-page .user-top-information .countitem.stat-friends .material-icons { color: #62bdf7; }
.profile-page .user-top-information .countitem.stat-cuddles .material-icons { color: #ff7592; }
.profile-page .user-top-information .countitem.stat-ups::before { background: #f6c65a; color: #f6c65a; }
.profile-page .user-top-information .countitem.stat-friends::before { background: #62bdf7; color: #62bdf7; }
.profile-page .user-top-information .countitem.stat-cuddles::before { background: #ff7592; color: #ff7592; }
.profile-page .user-top-information .countitem > * { position: relative; z-index: 1; }
.profile-page .user-top-information .countitem .count { color: var(--lup-text); font-weight: 750; font-size: 1.15rem; }
.profile-page .user-top-information .countitem .item { color: var(--lup-muted); font-size: .59rem; }
.profile-page .qr-cuddle-action { position: absolute; top: 6px; right: 7px; display: grid; place-items: center; width: 21px; height: 21px; margin: 0; border: 1px solid rgba(255,255,255,.20); border-radius: 50%; background-color: rgba(122,92,255,.24); box-shadow: 0 5px 11px rgba(0,0,0,.18); color: #ded8ff; font-size: 14px; cursor: pointer; }
.profile-page .user-top-information .countitem.stat-cuddles { position: relative; }
.profile-page .user-top-information .countitem.stat-cuddles { border-color:rgba(255,117,146,.23); background:linear-gradient(145deg,rgba(255,117,146,.16),rgba(122,92,255,.08)); }.profile-page .user-top-information .countitem.stat-cuddles:hover { border-color:rgba(255,154,177,.52); box-shadow:0 10px 20px rgba(255,82,133,.14),inset 0 1px 0 rgba(255,255,255,.18); }
.lup-cuddles-dialog { width:min(90vw,360px); overflow:hidden; border:1px solid rgba(255,255,255,.13); border-radius:24px; background:radial-gradient(circle at 50% 0,rgba(255,105,151,.25),transparent 38%),linear-gradient(150deg,#302743,#171927); }.lup-cuddles-dialog-content { position:relative; padding:25px 22px 23px; text-align:center; }.lup-cuddles-close { position:absolute; top:10px; right:10px; display:grid; place-items:center; width:32px; height:32px; padding:0; border:0; border-radius:50%; background:rgba(255,255,255,.08); color:#eae5f5; cursor:pointer; }.lup-cuddles-heart { display:grid; place-items:center; width:54px; height:54px; margin:0 auto 10px; border-radius:18px; background:linear-gradient(145deg,#ff9ab4,#d85b91); box-shadow:0 8px 0 rgba(120,38,78,.52),0 17px 27px rgba(0,0,0,.30),inset 0 2px 1px rgba(255,255,255,.43); color:#fff; }.lup-cuddles-heart .material-icons { font-size:28px; filter:drop-shadow(0 2px 0 rgba(117,36,75,.45)); }.lup-cuddles-dialog h2 { margin:0; color:#fff; font-size:22px; }.lup-cuddles-dialog p { margin:8px auto 17px; color:#d9d0e9; font-size:13px; line-height:1.42; }.lup-cuddles-qr { display:inline-grid; place-items:center; padding:10px; border:1px solid rgba(255,255,255,.18); border-radius:18px; background:#fff; box-shadow:0 12px 26px rgba(0,0,0,.30); }.lup-cuddles-qr img { display:block; width:min(58vw,200px); height:auto; }.lup-cuddles-hint { display:flex; align-items:center; justify-content:center; gap:5px; margin-top:15px; color:#f3b4c6; font-size:11px; font-weight:700; }.lup-cuddles-hint .material-icons { font-size:16px; }

/* A single calm visual language for the profile header and information cards. */
.profile-page .avatar-bg { padding: 72px 14px 82px; background: radial-gradient(circle at 50% 5%, rgba(122,92,255,.25), transparent 53%); }
.profile-page .profile-identity { position: relative; z-index: 3; margin-top: 16px; text-align: center; }
.profile-page .profile-identity h2 { color: #faf9ff; font-size: clamp(20px, 5vw, 25px); letter-spacing: -.02em; text-shadow: 0 4px 18px rgba(0,0,0,.28); }
.profile-page .profile-identity .profile-role { display:inline-block; padding:5px 11px; border:1px solid rgba(202,190,255,.33); border-radius:999px; background:rgba(122,92,255,.34); box-shadow:0 5px 15px rgba(0,0,0,.16),inset 0 1px rgba(255,255,255,.24); color:#fff; font-size:11px; font-weight:800; letter-spacing:.035em; text-shadow:0 1px 2px rgba(0,0,0,.38); }
.profile-page .profile-information { width: min(94%, 680px); margin: 14px auto 28px; }
.profile-page .profile-information .md-list-item-text { margin: 5px; padding: 13px 14px; min-height: 70px; border: 1px solid rgba(255,255,255,.09); border-radius: 14px; background: linear-gradient(135deg, rgba(122,92,255,.12), rgba(255,255,255,.04)); box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 8px 18px rgba(0,0,0,.13); }
.profile-page .profile-information .full .md-list-item-text { border-color: rgba(174,157,255,.26); background: linear-gradient(135deg, rgba(122,92,255,.23), rgba(43,157,244,.09)); }
.profile-page .profile-information h5 { margin: 0 0 6px; color: #bdb5d4; font-size: 10px; font-weight: 800; letter-spacing: .09em; }
.profile-page .profile-information p { margin: 0; color: #f1eff9; font-size: 14px; font-weight: 550; line-height: 1.4; }
@media (max-width: 380px) { .profile-page .avatar-bg { padding-top: 66px; padding-bottom: 76px; } .profile-page .user-top-information .countitems { gap: 5px; padding-left: 6px; padding-right: 6px; } .profile-page .user-top-information .countitem { min-height: 70px; } }

/* One calm LinkUUp profile tone: the avatar is the only visual focus. */
.profile-page .avatar-bg {
  overflow:hidden;
  background:#1b1d2b;
}
.profile-page .avatar-bg::before,
.profile-page .avatar-bg::after {
  content:'';
  position:absolute;
  z-index:0;
  pointer-events:none;
}
.profile-page .avatar-bg::before {
  display:none;
}
.profile-page .avatar-bg::after {
  display:none;
}
.profile-page .avatar-bg .avatar { z-index:2; }
.profile-page .avatar-bg .avatar::before { display:none; }
.profile-page .avatar-bg .large-avatar::after {
  content:'';
  position:absolute;
  inset:-8px;
  pointer-events:none;
  border:1px solid rgba(204,213,237,.24);
  border-radius:50%;
  box-shadow:0 0 0 6px rgba(132,151,194,.035), 0 0 18px rgba(108,132,196,.10);
  opacity:.58;
}
.profile-page .avatar-bg.profile-online .large-avatar::after { border-color:rgba(111,228,173,.55); box-shadow:0 0 0 6px rgba(83,204,145,.045),0 0 20px rgba(80,211,147,.28); animation:lup-profile-avatar-pulse 3.8s ease-in-out infinite; }
.profile-page .large-avatar { animation:none; }
.profile-page .profile-identity { z-index:3; }
@keyframes lup-profile-avatar-pulse { 0%,100% { transform:scale(1); opacity:.40; } 50% { transform:scale(1.016); opacity:.9; } }
@media (prefers-reduced-motion: reduce) { .profile-page .avatar-bg::before, .profile-page .avatar-bg::after, .profile-page .avatar-bg .large-avatar::after, .profile-page .large-avatar { animation:none; } }

/* About becomes a small, readable personal story rather than a raw settings list. */
.profile-adventure { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; padding: 14px 12px 28px; }
.profile-adventure md-list-item.profile-detail-card,
.profile-adventure md-list-item.profile-about-card {
  min-height: 84px;
  margin: 0;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(122,92,255,.14), rgba(255,255,255,.04));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07);
}
.profile-adventure md-list-item.profile-about-card { grid-column: 1 / -1; }
.profile-adventure .profile-detail-icon { display: grid; place-items: center; width: 34px; height: 34px; margin: 0 10px 0 0; border-radius: 11px; background: rgba(122,92,255,.24); color: #d9d2ff; font-size: 20px; }
.profile-adventure .profile-detail-card:nth-child(3n) .profile-detail-icon { background: rgba(43,157,244,.20); color: #a9d8ff; }
.profile-adventure .profile-detail-card:nth-child(4n) .profile-detail-icon { background: rgba(246,198,90,.18); color: #ffe19a; }
.profile-adventure .md-list-item-text h5 { margin: 0 0 5px; color: var(--lup-muted); font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.profile-adventure .md-list-item-text p { margin: 0; color: var(--lup-text); font-size: 13px; font-weight: 650; overflow-wrap: anywhere; }
.profile-adventure .profile-about-me { color: var(--lup-text); font-weight: 500; line-height: 1.45; }
@media (max-width: 360px) { .profile-adventure { grid-template-columns: 1fr; } .profile-adventure md-list-item.profile-about-card { grid-column: auto; } }

/* Keep the native About/Gallery tabs visually attached to the profile card on phones. */
@media (max-width: 768px) {
  .profile-page .information-tabs { top: -82px; }
}
.profile-page .information-tabs md-tabs-wrapper,
.profile-page .information-tabs md-tabs-wrapper.md-stretch-tabs md-pagination-wrapper {
  background: transparent;
  border-bottom: 0;
}
/* Gallery/About stay as clean text tabs; no coloured runner between them. */
.profile-page .information-tabs md-tabs md-ink-bar,
.profile-page .information-tabs .md-ink-bar { display: none; }
.profile-page .information-tabs md-tab-item:first-child { border-right: 0; }

.location-chat-surface {
  height: 100%;
  background: var(--lup-surface);
  color: var(--lup-text);
}
.location-chat-surface .chatbottom {
  height: 62px;
  background: transparent;
  border: 0;
  border-top: 1px solid rgba(255,255,255,.08);
}
.location-chat-surface .chatbottom input {
  background: rgba(255,255,255,.065);
  color: var(--lup-text);
  border: 1px solid rgba(255,255,255,.12);
}
.location-chat-surface .chatbottom button { border-radius: 12px; background-color: rgba(122,92,255,.26); }
.location-chat-surface .chatbottom button.sendmessage { background-color: #8d78ff; }
.location-chat-surface .chat-msgs .msg .message {
  background: rgba(255,255,255,.09);
  color: var(--lup-text);
  box-shadow: none;
}

/* A location is a live place, not merely another chat room. */
.location-page md-tabs { background: linear-gradient(135deg, #171827, #22203a); }
.location-page md-tabs md-tabs-wrapper { border-bottom: 1px solid rgba(255,255,255,.09); }
.location-page md-tabs md-tab-item { min-width: 0; color: #bdb8cf; font-size: 12px; font-weight: 750; letter-spacing: .04em; }
.location-page md-tabs md-tab-item.md-active { color: #f8f7ff; }
.location-page md-tabs md-ink-bar { height: 3px; border-radius: 3px 3px 0 0; background: linear-gradient(90deg,#8d78ff,#6ca8ff); }
.location-experience { background: linear-gradient(180deg, #1c1d2d 0%, #171825 100%); color: var(--lup-text); }
.location-hero { position: relative; min-height: 210px; overflow: hidden; background: #282940; }
.location-hero > img { display: block; width: 100%; height: 230px; object-fit: cover; opacity: .75; }
.location-hero-shade { position: absolute; inset: 0; background: linear-gradient(180deg,rgba(15,16,27,.08),rgba(16,17,30,.94)); }
.location-hero-copy { position: absolute; right: 18px; bottom: 17px; left: 18px; }
.location-hero-copy h1 { margin: 7px 0 3px; color: #fff; font-size: clamp(23px,5.6vw,30px); line-height: 1.05; letter-spacing: -.025em; }
.location-hero-copy p { margin: 0; color: #d9d5e6; font-size: 12px; }
.location-live-pill { display: inline-flex; align-items: center; gap: 4px; padding: 5px 9px; border: 1px solid rgba(194,182,255,.3); border-radius: 999px; background: rgba(89,69,176,.43); color: #f5f2ff; font-size: 11px; font-weight: 750; text-transform: uppercase; letter-spacing: .05em; }
.location-live-pill .material-icons { color: #d8ccff; font-size: 15px; }
.location-action-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; padding:14px 14px 10px; }
.location-action-row.has-phone { grid-template-columns:repeat(3,minmax(0,1fr)); }
.location-action { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; min-height:61px; padding:8px 5px; overflow:hidden; border:1px solid rgba(191,181,237,.14); border-radius:15px; background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.025)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 6px 14px rgba(0,0,0,.12); color:#e5e0f3; font:inherit; text-decoration:none; cursor:pointer; transition:transform .16s ease,border-color .16s ease,background .16s ease; }
.location-action::before { content:''; position:absolute; top:0; left:23%; right:23%; height:1px; background:linear-gradient(90deg,transparent,rgba(191,178,255,.75),transparent); opacity:.7; }
.location-action:hover, .location-action:focus { border-color:rgba(174,151,255,.52); background:linear-gradient(145deg,rgba(137,108,235,.22),rgba(79,145,209,.11)); transform:translateY(-1px); }
.location-action .material-icons { color:#b8a7ff; font-size:22px; text-shadow:0 0 12px rgba(165,138,255,.35); }.location-action span { font-size:10px; font-weight:780; letter-spacing:.025em; }
.location-action .room-open { color: #6ee0ad; }.location-action .room-closed { color: #ff8796; }.location-action .room-unknown { color: #d8c479; }
.location-rating-card { display: grid; grid-template-columns: minmax(0,1fr) auto 24px; gap: 11px; align-items: center; margin: 8px 14px 12px; padding: 15px 13px 14px 15px; border: 1px solid rgba(172,151,255,.22); border-radius: 17px; background: linear-gradient(125deg,rgba(113,82,218,.28),rgba(57,76,144,.22)); box-shadow: 0 13px 30px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.09); cursor: pointer; }
.rating-copy { display: grid; gap: 3px; }.rating-copy span { color: #cbc4e1; font-size: 11px; }.rating-copy strong { color: #fff; font-size: 13px; line-height: 17px; }
.rating-stars { display: grid; justify-items: end; }.location-rating-card .jk-rating-stars-container { width: 92px; }.location-rating-card .jk-rating-stars-container .button .material-icons { color: #f7cb68; font-size: 18px; }.rating-stars small { color: #c9c1df; font-size: 10px; }.rating-arrow { color: #e4deff; font-size: 20px; }
.location-comments { margin: 0 14px 24px; padding: 4px 0 12px; }.location-section-title { display:flex; align-items:center; justify-content:space-between; margin: 0 2px 10px; color:#f3f0fb; font-size:14px; font-weight:750; }.location-section-title button { display:inline-flex; align-items:center; padding:0; border:0; background:none; color:#ad9bff; font:inherit; font-size:11px; cursor:pointer; }.location-section-title button .material-icons { font-size:17px; }
.location-comment { display:flex; align-items:center; gap:10px; min-height:55px; margin-top:7px; padding:8px 10px; border:1px solid rgba(255,255,255,.07); border-radius:13px; background:rgba(255,255,255,.042); }.location-comment .lup-avatar { flex:0 0 34px; width:34px; height:34px; }.location-comment .lup-avatar img { width:34px; height:34px; }.location-comment lup-comment-text { color:#ded9ea; font-size:12px; line-height:17px; }.location-comment-empty { margin:0; padding:15px 12px; border:1px dashed rgba(255,255,255,.13); border-radius:13px; color:var(--lup-muted); font-size:12px; text-align:center; }

/* Location chat: a calm conversation surface with a deliberate send action. */
.location-chat-surface .chat-msgs { padding: 16px 14px; background: radial-gradient(circle at 10% 0,rgba(113,82,218,.10),transparent 34%), var(--lup-surface); }
.location-chat-surface .lup-msg { margin-bottom: 13px; }.location-chat-surface .chat-msgs .msg { max-width: 84%; }
.location-chat-surface .chat-msgs .msg .message { padding: 11px 12px; border: 1px solid rgba(255,255,255,.08); border-radius: 16px; box-shadow: 0 8px 20px rgba(0,0,0,.13); }
.location-chat-surface .lup-own-msg .message { border-color: rgba(166,145,255,.38); background: linear-gradient(135deg,rgba(126,97,230,.62),rgba(79,104,198,.60)); }
.location-chat-surface .chat-msgs .msg .name { color: #e5dfff; font-weight: 750; }.location-chat-surface .chat-msgs .msg .time { color: #aea8c0; }
.location-chat-surface .chatbottom { display: flex; align-items: center; height: 74px; padding: 10px 12px; box-sizing: border-box; background: rgba(20,21,34,.92); }
.location-chat-surface .chatbottom .chat-input { flex: 1; width: auto; padding: 0; }.location-chat-surface .chatbottom input { height: 48px; box-sizing: border-box; padding: 0 15px; border-radius: 15px; outline: 0; font-size: 14px; }
.location-chat-surface .chatbottom input:focus { border-color: rgba(163,141,255,.68); box-shadow: 0 0 0 3px rgba(135,103,255,.13); }
.location-chat-surface .chatbottom .chat-button { display:flex; align-items:center; justify-content:center; flex: 0 0 54px; width:54px; height:54px; padding:0; margin-left:10px; border-radius:16px; background: linear-gradient(135deg,#987eff,#6d92ed); box-shadow: 0 8px 19px rgba(91,70,188,.35), inset 0 1px 0 rgba(255,255,255,.24); }
.location-chat-surface .chatbottom button, .location-chat-surface .chatbottom button.sendmessage { width:25px; height:25px; min-width:25px; max-width:25px; padding:0; border-radius:0; background-color:#fff; -webkit-mask-size:contain; mask-size:contain; -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat; -webkit-mask-position:center; mask-position:center; }
.location-chat-surface .chatbottom .chat-button:has(button.sendmessage) { background: linear-gradient(135deg,#a78cff,#6da3ff); transform: translateY(-1px); }
/* The composer must never fall back to the old white Material surface. */
.location-chat-surface .chatbottom { background:#141522; border-top-color:rgba(255,255,255,.08); }
.location-chat-surface .chatbottom .chat-input { background:transparent; }
.location-chat-surface .chatbottom input { background:#25263b; color:#f7f5ff; -webkit-text-fill-color:#f7f5ff; border-color:rgba(185,169,255,.24); box-shadow:inset 0 1px 0 rgba(255,255,255,.045); }
.location-chat-surface .chatbottom input::placeholder { color:#aaa3bf; opacity:1; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms; animation-duration: .01ms; }
}

/* About me reads like a personal story, while details stay easy to scan. */
.profile-page .profile-information { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; padding:14px 12px 30px; background:radial-gradient(circle at 85% 0,rgba(122,92,255,.13),transparent 34%),var(--lup-bg); }
.profile-page .profile-information .profile-story-card { grid-column:1 / -1; min-height:112px; margin:0; padding:17px; border:1px solid rgba(183,165,255,.28); border-radius:19px; background:linear-gradient(135deg,rgba(115,85,223,.32),rgba(40,111,180,.14)); box-shadow:0 13px 28px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.10); overflow:hidden; }.profile-page .profile-story-card h5 { display:flex; align-items:center; gap:6px; color:#dfd7ff; }.profile-page .profile-story-card h5 .material-icons { color:#ffd16b; font-size:16px; }.profile-page .profile-story-card .profile-about-me { color:#fff; font-size:15px; line-height:1.52; }
.profile-page .profile-information .profile-detail-card { min-width:0; min-height:77px; margin:0; padding:11px 10px; border:1px solid rgba(255,255,255,.075); border-radius:15px; background:rgba(255,255,255,.045); }.profile-page .profile-information .profile-detail-card:nth-child(3n) { background:linear-gradient(135deg,rgba(43,157,244,.11),rgba(255,255,255,.035)); }.profile-page .profile-information .profile-detail-card h5 { color:#aaa2c3; font-size:9px; }.profile-page .profile-information .profile-detail-card p { overflow:hidden; color:#f4f2fb; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }
.profile-page .profile-information .profile-detail-card h5 { display:flex; align-items:center; gap:5px; }.profile-page .profile-information .profile-detail-card h5 .material-icons { display:grid; place-items:center; flex:0 0 22px; width:22px; height:22px; border-radius:8px; background:rgba(133,108,239,.22); color:#cfc2ff; font-size:14px; }.profile-page .profile-information .profile-detail-card:nth-child(3n) h5 .material-icons { background:rgba(57,169,244,.16); color:#99dbff; }.profile-page .profile-information .profile-detail-card:nth-child(4n) h5 .material-icons { background:rgba(246,198,90,.16); color:#ffdb82; }
.profile-page .profile-information .profile-detail-card { position:relative; isolation:isolate; min-height:92px; padding:12px 11px 10px; overflow:hidden; border-radius:18px; background:linear-gradient(140deg,rgba(112,84,213,.22),rgba(255,255,255,.035)); }.profile-page .profile-information .profile-detail-card::after { content:''; position:absolute; z-index:-1; right:-22px; bottom:-30px; width:95px; height:95px; border-radius:50%; background:rgba(154,132,255,.24); filter:blur(7px); }.profile-page .profile-information .profile-detail-card h5 { gap:7px; color:#c9c1df; font-size:9px; letter-spacing:.07em; }.profile-page .profile-information .profile-detail-card h5 .material-icons { flex:0 0 30px; width:30px; height:30px; border:1px solid rgba(255,255,255,.16); border-radius:11px; background:linear-gradient(145deg,#8a70ed,#536fca); color:#fff; font-size:17px; box-shadow:0 6px 14px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.25); }.profile-page .profile-information .profile-detail-card p { margin-top:9px; color:#fff; font-size:14px; font-weight:700; line-height:1.22; white-space:normal; word-break:break-word; }.profile-page .profile-information .profile-detail-card:nth-child(3n) { background:linear-gradient(140deg,rgba(39,139,214,.24),rgba(255,255,255,.035)); }.profile-page .profile-information .profile-detail-card:nth-child(3n)::after { background:rgba(65,181,248,.22); }.profile-page .profile-information .profile-detail-card:nth-child(3n) h5 .material-icons { background:linear-gradient(145deg,#44b3ee,#4271cb); color:#fff; }.profile-page .profile-information .profile-detail-card:nth-child(4n) { background:linear-gradient(140deg,rgba(209,123,76,.23),rgba(255,255,255,.035)); }.profile-page .profile-information .profile-detail-card:nth-child(4n) h5 .material-icons { background:linear-gradient(145deg,#edaa5b,#c55e92); color:#fff; }
/* On a phone the personal badges get their own stage: more room for real information. */
.profile-page .profile-information { width:min(100%,900px); grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding-left:8px; padding-right:8px; }
.profile-page .profile-information .profile-detail-card { min-height:88px; padding:12px 13px 11px; border-radius:20px; border-color:rgba(255,255,255,.12); box-shadow:0 10px 22px rgba(0,0,0,.15),inset 0 1px 0 rgba(255,255,255,.10); }
.profile-page .profile-information .profile-detail-card::after { right:-10px; bottom:-48px; width:128px; height:128px; opacity:.82; }
.profile-page .profile-information .profile-detail-card h5 { gap:9px; font-size:9px; letter-spacing:.08em; }
.profile-page .profile-information .profile-detail-card h5 .material-icons { flex-basis:38px; width:38px; height:38px; border-radius:14px; font-size:21px; }
.profile-page .profile-information .profile-detail-card p { margin:7px 2px 0 47px; min-height:20px; color:#fff; font-size:15px; line-height:1.25; text-shadow:0 1px 12px rgba(0,0,0,.16); }
.profile-page .profile-information .profile-detail-card h5::after { content:''; flex:1; height:1px; margin-left:2px; background:linear-gradient(90deg,rgba(255,255,255,.18),transparent); }
.profile-page .profile-information { max-width:900px; }
.profile-page .profile-information .profile-detail-card { min-height:103px; padding:15px 14px 13px; border-color:rgba(255,255,255,.15); box-shadow:0 13px 27px rgba(0,0,0,.17),inset 0 1px 0 rgba(255,255,255,.13); }
.profile-page .profile-information .profile-detail-card .md-list-item-text { min-height:0; margin:0; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
.profile-page .profile-information { width:100%; box-sizing:border-box; gap:8px; padding-left:4px; padding-right:4px; }
.profile-page .profile-information .profile-detail-card { height:112px; min-height:112px; box-sizing:border-box; padding-left:15px; padding-right:15px; }
.profile-page .profile-information .profile-detail-card p { display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
@media (max-width:360px) { .profile-page .profile-information { gap:8px; padding-left:10px; padding-right:10px; } .profile-page .profile-information .profile-detail-card { min-height:98px; padding:12px 10px; } .profile-page .profile-information .profile-detail-card h5 { font-size:8px; gap:6px; } .profile-page .profile-information .profile-detail-card h5 .material-icons { flex-basis:31px; width:31px; height:31px; font-size:17px; } .profile-page .profile-information .profile-detail-card p { font-size:13px; } }

/* Profile compass: the personal text gets a meaningful continuation using
   actual profile settings, never invented biography cards. */
.profile-page .profile-information .profile-compass {
  grid-column:1 / -1;
  margin-top:3px;
  padding:14px 12px 16px;
  border:1px solid rgba(183,174,224,.13);
  border-radius:22px;
  background:radial-gradient(circle at 92% 8%,rgba(116,159,235,.14),transparent 34%),linear-gradient(145deg,rgba(34,37,54,.84),rgba(22,24,36,.78));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 25px rgba(0,0,0,.14);
}
.profile-compass-heading { display:flex; align-items:center; gap:10px; margin:0 2px 12px; }
.profile-compass-seal { display:grid; place-items:center; width:34px; height:34px; border:1px solid rgba(175,202,255,.26); border-radius:11px 11px 11px 5px; background:linear-gradient(145deg,rgba(100,138,233,.43),rgba(92,76,182,.34)); box-shadow:inset 0 1px 0 rgba(255,255,255,.23),0 6px 13px rgba(0,0,0,.20); color:#e8f2ff; }.profile-compass-seal .material-icons { font-size:19px; }
.profile-compass-heading small,.profile-compass-item small { display:block; color:#a9a3bd; font-size:8px; font-weight:850; letter-spacing:.10em; line-height:1.1; }.profile-compass-heading strong { display:block; margin-top:3px; color:#f5f3fb; font-size:14px; }
.profile-compass-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.profile-compass-item { display:flex; align-items:center; min-width:0; min-height:54px; padding:7px; border:1px solid rgba(255,255,255,.07); border-radius:14px; background:rgba(255,255,255,.035); }
.profile-compass-item > .material-icons { display:grid; place-items:center; flex:0 0 29px; width:29px; height:29px; margin-right:7px; border-radius:9px 9px 9px 4px; background:rgba(141,122,232,.17); color:#cfc5ff; font-size:16px; }.profile-compass-item:nth-child(3n) > .material-icons { background:rgba(86,186,221,.15); color:#a6e5f0; }.profile-compass-item:nth-child(4n) > .material-icons { background:rgba(230,159,108,.15); color:#ffd0a7; }
.profile-compass-item div { min-width:0; }.profile-compass-item strong { display:block; margin-top:3px; overflow:hidden; color:#f4f2fb; font-size:11px; line-height:1.15; text-overflow:ellipsis; white-space:nowrap; }
.profile-compass-empty { display:flex; align-items:center; width:100%; min-height:58px; padding:9px 10px; border:1px dashed rgba(179,165,255,.30); border-radius:15px; background:rgba(126,100,222,.08); color:#eeeaff; font:inherit; text-align:left; cursor:pointer; }.profile-compass-empty > .material-icons:first-child { margin:0 10px 0 2px; color:#c8baff; }.profile-compass-empty span { flex:1; }.profile-compass-empty strong,.profile-compass-empty small { display:block; }.profile-compass-empty strong { font-size:12px; }.profile-compass-empty small { margin-top:3px; color:#bdb5d4; font-size:10px; }.profile-compass-empty > .material-icons:last-child { color:#a99ce1; }
@media (max-width:360px) { .profile-compass-grid { grid-template-columns:1fr; }.profile-page .profile-information .profile-compass { padding:12px 10px; } }

.settings-page > md-content { background:radial-gradient(circle at 88% 0,rgba(122,92,255,.14),transparent 32%),var(--lup-bg); }.settings-page .lup-settings-list { padding:10px 13px 28px; background:transparent; }.settings-page .lup-settings-list .md-subheader { color:#b8afd3; letter-spacing:.08em; font-size:10px; font-weight:800; text-transform:uppercase; background:transparent; }.settings-page .lup-settings-list md-list-item { border-color:rgba(255,255,255,.10); background:rgba(255,255,255,.045); }.settings-page .lup-settings-list .md-list-item-text h3 { color:#f7f5ff; }.settings-page .lup-settings-list .md-list-item-text p { color:#c1b9d6; }.settings-page .lup-settings-list md-select .md-select-value, .settings-page .lup-settings-list md-select .md-select-value span { color:#fff; border-bottom-color:rgba(185,169,255,.44); }.settings-page .lup-settings-list md-switch .md-label { color:#f1eef9; }
.account-page > md-content { background:radial-gradient(circle at 88% 0,rgba(43,157,244,.12),transparent 31%),var(--lup-bg); }.account-page form, .account-page .account-form { color:var(--lup-text); }.account-page md-input-container label { color:#bdb5d4; }.account-page md-input-container input { color:#f8f7ff; }.account-page md-input-container input:disabled { color:#c6bfd5; -webkit-text-fill-color:#c6bfd5; }.account-page md-select .md-select-value, .account-page md-select .md-select-value span { color:#fff; border-bottom-color:rgba(185,169,255,.44); }
.profile-settings-page > md-content { background:radial-gradient(circle at 88% 0,rgba(122,92,255,.14),transparent 32%),var(--lup-bg); color:var(--lup-text); }.profile-settings-page md-list { width:min(100%,720px); margin:0 auto; padding:10px 13px 28px; background:transparent; }.profile-settings-page .md-subheader { color:#bdb5d4; background:transparent; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.profile-settings-page md-list-item { margin:7px 0; border:1px solid rgba(255,255,255,.08); border-radius:15px; background:rgba(255,255,255,.045); }.profile-settings-page h5, .profile-settings-page .md-list-item-text { color:#f5f2ff; }.profile-settings-page md-select .md-select-value, .profile-settings-page md-select .md-select-value span { color:#fff; border-bottom-color:rgba(185,169,255,.50); }.profile-settings-page md-input-container input, .profile-settings-page md-input-container textarea { color:#fff; -webkit-text-fill-color:#fff; }.profile-settings-page md-input-container textarea { background:rgba(255,255,255,.04); border-radius:11px; padding:10px; }.profile-settings-page md-option[selected], .profile-settings-page md-option.md-selected { color:#fff; background:rgba(122,92,255,.24); }
.md-sidenav-left md-list-item .nav-icon { position:relative; overflow:visible; }.md-sidenav-left md-list-item .nav-icon::after { content:''; position:absolute; right:-2px; bottom:-2px; width:6px; height:6px; border:1px solid rgba(255,255,255,.35); border-radius:50%; background:#b8a9ff; box-shadow:0 0 8px rgba(184,169,255,.8); }.md-sidenav-left md-list-item.nav-discover .nav-icon::after { background:#7fdcff; }.md-sidenav-left md-list-item.nav-friends .nav-icon::after { background:#ff9ecb; }

/* One focused profile story instead of a wall of disconnected facts. */
.profile-page .profile-information.profile-about-single { display:block; width:min(100%,720px); box-sizing:border-box; margin:0 auto; padding:16px 13px 32px; background:radial-gradient(circle at 84% 0,rgba(122,92,255,.16),transparent 38%),var(--lup-bg); }
.profile-page .profile-information.profile-about-single .profile-story-card { position:relative; min-height:178px; margin:0; padding:23px 21px; overflow:hidden; border:1px solid rgba(184,166,255,.29); border-radius:24px; background:linear-gradient(142deg,rgba(115,85,223,.34),rgba(45,109,178,.17)); box-shadow:0 17px 34px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.13); }
.profile-page .profile-information.profile-about-single .profile-story-card::before { content:'“'; position:absolute; top:-27px; right:16px; color:rgba(255,255,255,.11); font-family:Georgia,serif; font-size:150px; line-height:1; }
.profile-page .profile-information.profile-about-single .profile-story-card .md-list-item-text { position:relative; min-height:0; margin:0; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
.profile-page .profile-information.profile-about-single .profile-story-card h5 { display:flex; align-items:center; gap:8px; margin:0 0 16px; color:#e7e0ff; font-size:11px; font-weight:800; letter-spacing:.11em; text-transform:uppercase; }
.profile-page .profile-information.profile-about-single .profile-story-card h5 .material-icons { display:grid; place-items:center; width:31px; height:31px; border:1px solid rgba(255,255,255,.2); border-radius:11px; background:linear-gradient(145deg,#9b7fff,#5479d2); color:#fff0b5; font-size:18px; box-shadow:0 7px 16px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.28); }
.profile-page .profile-information.profile-about-single .profile-about-me { margin:0; color:#fff; font-size:16px; line-height:1.64; white-space:pre-line; word-break:break-word; text-shadow:0 1px 13px rgba(0,0,0,.16); }
.profile-page .profile-information.profile-about-single .profile-about-empty { max-width:300px; margin:27px 0 0; color:#d1c9e7; font-size:15px; font-style:italic; line-height:1.5; }
.profile-settings-page .profile-about-editor { padding:7px 15px 10px; border-color:rgba(184,166,255,.28); background:linear-gradient(142deg,rgba(106,79,205,.18),rgba(255,255,255,.045)); }.profile-settings-page .profile-about-editor md-input-container { margin:8px 0 0; }.profile-settings-page .profile-about-editor label { color:#d8d0ec; font-weight:700; }.profile-settings-page .profile-about-editor textarea { min-height:142px; line-height:1.5; }

/* A warmer, more tactile frame for the one personal profile note. */
.profile-page .profile-information.profile-about-single { padding-top:20px; background:radial-gradient(ellipse at 50% -5%,rgba(151,119,255,.22),transparent 43%),radial-gradient(circle at 84% 0,rgba(67,167,243,.12),transparent 36%),var(--lup-bg); }
.profile-page .profile-information.profile-about-single .profile-story-card { min-height:190px; padding:25px 23px 24px; border-color:rgba(207,194,255,.35); border-radius:27px; background:linear-gradient(135deg,rgba(126,94,233,.40) 0%,rgba(77,94,191,.27) 54%,rgba(29,40,77,.37) 100%); box-shadow:0 20px 38px rgba(0,0,0,.27),0 0 0 5px rgba(135,108,238,.045),inset 0 1px 0 rgba(255,255,255,.19),inset 0 -20px 34px rgba(9,12,33,.18); }
.profile-page .profile-information.profile-about-single .profile-story-card::after { content:''; position:absolute; right:-44px; bottom:-58px; width:174px; height:174px; border:1px solid rgba(255,255,255,.13); border-radius:50%; box-shadow:0 0 0 25px rgba(168,145,255,.055),0 0 0 51px rgba(92,174,255,.035); }
.profile-page .profile-information.profile-about-single .profile-story-card h5 { padding-bottom:13px; border-bottom:1px solid rgba(255,255,255,.13); color:#f1edff; text-shadow:0 1px 9px rgba(0,0,0,.2); }
.profile-page .profile-information.profile-about-single .profile-about-me { max-width:590px; color:#fff; font-size:16px; letter-spacing:.005em; }
.profile-page .profile-information.profile-about-single .profile-about-empty { position:relative; padding-left:16px; color:#ded8f0; }.profile-page .profile-information.profile-about-single .profile-about-empty::before { content:''; position:absolute; top:4px; bottom:4px; left:0; width:3px; border-radius:3px; background:linear-gradient(#ffd777,#a38aff); }
@media (max-width:360px) { .profile-page .profile-information.profile-about-single { padding-right:10px; padding-left:10px; } .profile-page .profile-information.profile-about-single .profile-story-card { min-height:174px; padding:20px 17px; } .profile-page .profile-information.profile-about-single .profile-about-me { font-size:15px; } }

/* Profile collections: four distinct little destinations with breathing room. */
.profile-page .user-top-information { width:min(92%,720px); margin-top:-57px; padding-top:15px; border-color:rgba(190,177,255,.16); border-radius:25px; background:linear-gradient(148deg,rgba(45,47,74,.98),rgba(21,23,38,.99)); }
.profile-page .user-top-information .countitems { gap:11px; padding:0 13px 15px; }
.profile-page .user-top-information .countitem { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:108px; padding:12px 5px 10px; border-color:rgba(255,255,255,.10); border-radius:20px; background:linear-gradient(155deg,rgba(255,255,255,.105),rgba(255,255,255,.035)); box-shadow:0 11px 20px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.13); }
.profile-page .user-top-information .countitem::before { top:0; left:24%; right:24%; height:4px; box-shadow:0 0 15px currentColor; }
.profile-page .user-top-information .countitem::after { top:8px; width:81px; height:70px; opacity:.14; filter:blur(15px); }
.profile-page .user-top-information .countitem > .material-icons:not(.qr-cuddle-action) { display:grid; place-items:center; width:43px; height:43px; margin:0 0 6px; border:1px solid rgba(255,255,255,.17); border-radius:15px; background:linear-gradient(145deg,#8b70ef,#5275cc); box-shadow:0 8px 0 rgba(49,40,106,.42),0 14px 22px rgba(0,0,0,.23),inset 0 1px 0 rgba(255,255,255,.3); color:#fff; font-size:24px; text-shadow:0 1px 0 rgba(0,0,0,.18); }
.profile-page .user-top-information .countitem.stat-locations { border-color:rgba(174,150,255,.28); background:linear-gradient(150deg,rgba(126,94,233,.25),rgba(255,255,255,.045)); }.profile-page .user-top-information .countitem.stat-locations > .material-icons { background:linear-gradient(145deg,#9c7bff,#635fc7); color:#fff; }
.profile-page .user-top-information .countitem.stat-ups { border-color:rgba(246,198,90,.27); background:linear-gradient(150deg,rgba(246,198,90,.16),rgba(255,255,255,.04)); }.profile-page .user-top-information .countitem.stat-ups > .material-icons { background:linear-gradient(145deg,#f3c65d,#cf8351); color:#fff5c5; box-shadow:0 8px 0 rgba(133,76,38,.42),0 14px 22px rgba(0,0,0,.23),inset 0 1px 0 rgba(255,255,255,.34); }
.profile-page .user-top-information .countitem.stat-friends { border-color:rgba(98,189,247,.27); background:linear-gradient(150deg,rgba(66,174,235,.18),rgba(255,255,255,.04)); }.profile-page .user-top-information .countitem.stat-friends > .material-icons { background:linear-gradient(145deg,#62c6f7,#4676cf); color:#fff; box-shadow:0 8px 0 rgba(39,76,143,.42),0 14px 22px rgba(0,0,0,.23),inset 0 1px 0 rgba(255,255,255,.34); }
.profile-page .user-top-information .countitem.stat-cuddles { border-color:rgba(255,140,173,.32); background:linear-gradient(150deg,rgba(255,117,146,.22),rgba(122,92,255,.10)); }.profile-page .user-top-information .countitem.stat-cuddles > .material-icons:not(.qr-cuddle-action) { background:linear-gradient(145deg,#ff9bb4,#cd5f93); color:#fff; box-shadow:0 8px 0 rgba(130,44,80,.43),0 14px 22px rgba(0,0,0,.23),inset 0 1px 0 rgba(255,255,255,.34); }
.profile-page .user-top-information .countitem .count { margin-top:3px; color:#fff; font-size:1.35rem; font-weight:850; letter-spacing:-.035em; text-shadow:0 2px 8px rgba(0,0,0,.24); }.profile-page .user-top-information .countitem .item { margin-top:1px; color:#d7d0e9; font-size:.61rem; font-weight:800; letter-spacing:.055em; }
.profile-page .user-top-information .countitem:hover { transform:translateY(-5px) scale(1.025); }.profile-page .qr-cuddle-action { top:7px; right:7px; width:23px; height:23px; font-size:14px; }
@media (max-width:380px) { .profile-page .user-top-information { width:94%; } .profile-page .user-top-information .countitems { gap:6px; padding-right:8px; padding-left:8px; } .profile-page .user-top-information .countitem { min-height:99px; } .profile-page .user-top-information .countitem > .material-icons:not(.qr-cuddle-action) { width:38px; height:38px; border-radius:13px; font-size:21px; } .profile-page .user-top-information .countitem .count { font-size:1.2rem; } .profile-page .user-top-information .countitem .item { font-size:.54rem; } }

/* Small optical offset: the four collection cards now align with the profile content. */
.profile-page .user-top-information { transform:none; }
.profile-page .user-top-information .countitem.stat-cuddles { cursor:pointer; }.profile-page .user-top-information .countitem.stat-cuddles .qr-cuddle-main { background:linear-gradient(145deg,#ff9bb4,#cd5f93); color:#fff; box-shadow:0 8px 0 rgba(130,44,80,.43),0 14px 22px rgba(0,0,0,.23),inset 0 1px 0 rgba(255,255,255,.34); }
.profile-page .profile-up-action { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-width:112px; height:42px; padding:0 15px; margin:0 7px 0 0; border:1px solid rgba(255,216,111,.38); border-radius:15px; background:linear-gradient(145deg,#f5c95e,#cb8049); box-shadow:0 7px 0 rgba(128,72,32,.44),0 14px 21px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.33); color:#fff9df; font:inherit; font-size:12px; font-weight:850; letter-spacing:.02em; cursor:pointer; text-shadow:0 1px 0 rgba(111,58,22,.37); transition:transform .16s ease,filter .16s ease; }.profile-page .profile-up-action:hover { transform:translateY(-2px); filter:brightness(1.08); }.profile-page .profile-up-action:active { transform:translateY(3px); box-shadow:0 3px 0 rgba(128,72,32,.44),0 8px 14px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.33); }.profile-page .profile-up-action .material-icons { font-size:20px; }
/* Original LinkUUp mark: two linked forms, not a three-point star. */
.login .login-emblem { position:relative; z-index:1; display:block; width:49px; height:36px; margin:43px auto 15px; border:0; border-radius:0; box-shadow:none; background:transparent; }.login .login-emblem::before, .login .login-emblem::after { content:''; position:absolute; top:2px; width:22px; height:30px; border:2px solid #dcd5ff; border-radius:12px; box-sizing:border-box; transform:rotate(42deg); box-shadow:0 7px 16px rgba(0,0,0,.23),inset 0 1px 0 rgba(255,255,255,.28); background:rgba(145,113,242,.10); }.login .login-emblem::before { left:5px; border-color:#c8b7ff; }.login .login-emblem::after { right:5px; border-color:#8bcbf7; background:rgba(70,165,237,.10); }.login .login-emblem span { position:absolute; z-index:2; top:15px; left:18px; width:14px; height:6px; border-radius:5px; background:linear-gradient(90deg,#c4b0ff,#91cef8); box-shadow:0 0 12px rgba(161,140,255,.63); transform:none; }
.login .login-wordmark { margin-top:0; font-size:clamp(46px,12.2vw,70px); font-weight:650; letter-spacing:-.075em; }.login .login-wordmark-link { font-weight:350; letter-spacing:-.085em; }.login .login-wordmark-up { margin-left:.08em; font-weight:850; letter-spacing:-.095em; }.login .login-brand-claim { margin:16px auto 0; }.login .login-brand-route { display:none; }

/* The mark deliberately overlaps the title: one connected LinkUUp signature. */
.login .login-emblem { width:68px; height:49px; margin:25px auto -4px; filter:drop-shadow(0 12px 14px rgba(0,0,0,.25)); }.login .login-emblem::before, .login .login-emblem::after { top:3px; width:31px; height:43px; border-width:3px; border-radius:16px; box-shadow:0 7px 0 rgba(61,47,123,.34),0 14px 22px rgba(0,0,0,.18),inset 0 2px 1px rgba(255,255,255,.34); }.login .login-emblem::before { left:7px; }.login .login-emblem::after { right:7px; box-shadow:0 7px 0 rgba(35,92,139,.32),0 14px 22px rgba(0,0,0,.18),inset 0 2px 1px rgba(255,255,255,.34); }.login .login-emblem span { top:21px; left:25px; width:20px; height:8px; box-shadow:0 0 14px rgba(161,140,255,.75),inset 0 1px 0 rgba(255,255,255,.38); }.login .login-wordmark { position:relative; z-index:2; font-size:clamp(49px,13vw,74px); text-shadow:0 8px 0 rgba(26,28,54,.30),0 15px 25px rgba(0,0,0,.30); }.login .login-brand-claim { position:relative; z-index:2; }
@media (min-width:760px) { .login .login-emblem { margin-top:31px; } }

/* Two paperclips meeting in the middle: LinkUUp's own symbol for connection. */
.login .login-emblem { width:74px; height:52px; margin:25px auto -3px; filter:drop-shadow(0 12px 14px rgba(0,0,0,.25)); }.login .login-emblem::before, .login .login-emblem::after { content:none; }.login .login-emblem .login-paperclip { position:absolute; z-index:1; top:4px; width:27px; height:43px; border:3px solid #d9d0ff; border-radius:15px; box-sizing:border-box; box-shadow:0 7px 0 rgba(49,43,108,.33),inset 0 2px 1px rgba(255,255,255,.35); transform:none; }.login .login-emblem .login-paperclip::after { content:''; position:absolute; top:6px; right:5px; bottom:6px; left:5px; width:auto; height:auto; border:2px solid currentColor; border-top-color:transparent; border-radius:10px; background:transparent; box-shadow:none; }.login .login-emblem .login-paperclip-left { left:20px; color:#cfbfff; border-color:#cfbfff; transform:rotate(-22deg); background:linear-gradient(145deg,rgba(171,143,255,.22),rgba(91,72,181,.08)); }.login .login-emblem .login-paperclip-right { right:20px; left:auto; color:#94d2fa; border-color:#94d2fa; transform:rotate(22deg); background:linear-gradient(145deg,rgba(109,196,245,.20),rgba(58,112,195,.08)); box-shadow:0 7px 0 rgba(32,86,136,.30),inset 0 2px 1px rgba(255,255,255,.35); }.login .login-brand-claim { max-width:none; margin:17px auto 0; color:#d2cce2; font-size:11px; font-weight:600; letter-spacing:.018em; white-space:nowrap; }

/* Recovery uses the same calm arrival screen, with one clear task. */
.recovery-page .recovery-brand-stage { min-height:214px; }.recovery-page .recovery-brand-stage .login-emblem { margin-top:23px; }.recovery-page .recovery-panel { width:min(88%,430px); box-sizing:border-box; margin:-20px auto 0; padding:23px 22px 20px; border:1px solid rgba(222,215,255,.17); border-radius:25px; background:linear-gradient(145deg,rgba(43,44,69,.95),rgba(25,27,45,.95)); box-shadow:0 24px 48px rgba(0,0,0,.33),inset 0 1px 0 rgba(255,255,255,.11); }.recovery-page .recovery-panel h1 { margin:0 0 16px; color:#f7f5ff; font-size:18px; font-weight:800; letter-spacing:-.02em; }.recovery-page .recovery-panel md-input-container { width:100%; margin:7px 0 16px; padding:0 4px; border:0; border-bottom:1px solid rgba(229,224,247,.48); border-radius:0; background:transparent; }.recovery-page .recovery-panel md-input-container.md-input-focused { border-bottom-color:#d6c7ff; box-shadow:none; }.recovery-page .recovery-panel md-input-container label { color:#c9c1e2; font-size:11px; font-weight:800; letter-spacing:.055em; text-transform:uppercase; }.recovery-page .recovery-panel input { color:#fff; font-size:16px; }.recovery-page .recovery-panel img { display:block; max-width:100%; margin:4px auto; border-radius:10px; }.recovery-page .recovery-panel .login-button, .recovery-page .recovery-panel .backtologin { width:100%; height:52px; margin:6px 0 0; border-radius:16px; font-size:14px; font-weight:800; text-transform:none; }.recovery-page .recovery-panel .backtologin { border:1px solid rgba(195,181,255,.22); background:rgba(255,255,255,.06); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); color:#e8e3f6; }.recovery-page .login-bottom { margin-top:20px; }

/* Familiar paperclip silhouettes and a calm recovery-field focus state. */
.login .login-emblem .login-paperclip { position:absolute; z-index:1; top:0; width:auto; height:auto; border:0; border-radius:0; background:transparent; box-shadow:none; font-size:48px; line-height:52px; }.login .login-emblem .login-paperclip::after { content:none; }.login .login-emblem .login-paperclip-left { left:9px; color:#cdbbff; transform:rotate(-35deg); }.login .login-emblem .login-paperclip-right { right:9px; left:auto; color:#8fd4fb; transform:rotate(35deg); box-shadow:none; }.recovery-page .recovery-panel input:focus, .recovery-page .recovery-panel input:focus-visible { outline:0; box-shadow:none; }

/* Final identity: a crisp LU monogram with a lively but disciplined night stage. */
.login .login-brand-stage { min-height:258px; background:radial-gradient(circle at 15% 12%,rgba(126,92,238,.47),transparent 29%),radial-gradient(circle at 88% 78%,rgba(39,159,234,.31),transparent 31%),linear-gradient(145deg,#12152a 0%,#20203a 48%,#111521 100%); }.login .login-brand-stage::before { content:''; position:absolute; z-index:-1; inset:0; transform:none; color:transparent; background:linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px); background-size:34px 34px; mask-image:linear-gradient(to bottom,rgba(0,0,0,.68),transparent 86%); }.login .login-brand-stage::after { width:250px; height:250px; right:-92px; top:-122px; border:1px solid rgba(203,193,255,.28); border-radius:50%; box-shadow:0 0 0 25px rgba(163,144,255,.045),0 0 0 53px rgba(85,177,241,.035); }.login .login-brand-glow { bottom:-74px; left:calc(50% - 105px); width:210px; height:125px; background:linear-gradient(90deg,#785cf0,#36a6eb); filter:blur(52px); opacity:.32; }
.login .login-monogram { position:relative; z-index:2; display:flex; align-items:center; justify-content:center; width:56px; height:56px; margin:31px auto 12px; overflow:hidden; border:1px solid rgba(255,255,255,.25); border-radius:18px; background:linear-gradient(145deg,rgba(179,157,255,.96),rgba(76,123,215,.94)); box-shadow:0 10px 0 rgba(43,43,105,.48),0 19px 30px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.43); transform:rotate(-7deg); }.login .login-monogram::before { content:''; position:absolute; inset:5px; border:1px solid rgba(255,255,255,.22); border-radius:13px; }.login .login-monogram span { position:relative; z-index:1; color:#fff; font-family:Arial,sans-serif; font-size:25px; font-weight:900; letter-spacing:-.17em; text-shadow:0 2px 0 rgba(45,43,112,.36); }.login .login-monogram span + span { margin-left:5px; color:#f0db9c; }
.login .login-wordmark { margin-top:0; font-family:Arial,sans-serif; font-size:clamp(33px,9.8vw,49px); font-weight:350; letter-spacing:.035em; line-height:1; text-shadow:0 6px 18px rgba(0,0,0,.28); text-transform:uppercase; }.login .login-wordmark-link { font-weight:350; letter-spacing:.075em; }.login .login-wordmark-up { margin-left:.075em; font-weight:850; letter-spacing:.015em; background:linear-gradient(135deg,#ffe49c 0%,#c7adff 48%,#6dcbf5 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }.login .login-brand-claim { position:relative; z-index:2; margin:14px auto 0; color:#e1ddeb; font-size:11px; font-weight:650; letter-spacing:.035em; text-align:center; text-shadow:0 1px 8px rgba(0,0,0,.18); }.recovery-page .recovery-brand-stage { min-height:222px; }.recovery-page .recovery-brand-stage .login-monogram { margin-top:25px; }
@media (min-width:760px) { .login .login-brand-stage { min-height:282px; }.login .login-monogram { margin-top:39px; } }

/* A clean location beacon: LinkUUp starts with finding each other in a real place. */
.login .login-monogram { display:none; }.login .login-symbol { position:relative; z-index:2; display:grid; place-items:center; width:58px; height:58px; margin:30px auto 12px; border:1px solid rgba(235,231,255,.32); border-radius:50%; background:radial-gradient(circle at 34% 25%,rgba(255,255,255,.33),transparent 29%),linear-gradient(145deg,#9b7bf1,#497bce); box-shadow:0 10px 0 rgba(43,43,105,.44),0 20px 32px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.42); }.login .login-symbol::before { content:''; position:absolute; inset:-7px; border:1px solid rgba(194,177,255,.20); border-radius:50%; }.login .login-symbol::after { content:''; position:absolute; bottom:-16px; width:32px; height:12px; border-radius:50%; background:rgba(114,160,255,.37); filter:blur(7px); }.login .login-symbol .material-icons { position:relative; z-index:1; color:#fff; font-size:36px; filter:drop-shadow(0 2px 0 rgba(47,47,116,.36)); }.recovery-page .recovery-brand-stage .login-symbol { margin-top:24px; }.recovery-page .recovery-panel .recovery-explainer { margin:-7px 0 16px; color:#c4bdd6; font-size:12px; line-height:1.45; }.recovery-page .recovery-panel { padding-top:25px; }
.recovery-page .recovery-panel md-input-container .md-input { position:relative; top:25px; line-height:24px; }
@media (min-width:760px) { .login .login-symbol { margin-top:38px; } }

/* Sidebar: understated navigation that stays with the dark LinkUUp language. */
.md-sidenav-left {
  border-right: 1px solid rgba(207, 201, 234, .12);
  background: #151721;
  box-shadow: 14px 0 34px rgba(0, 0, 0, .24);
}
.md-sidenav-left .sidenav-brand {
  min-height: 72px;
  background: #1b1d2a;
  border-bottom: 1px solid rgba(255,255,255,.09);
}
.md-sidenav-left .sidenav-brand::before { display: none; }
.md-sidenav-left .sidenav-brand .md-toolbar-tools { height: 72px; padding: 0 18px; }
.md-sidenav-left .sidenav-brand h1 {
  color: #f6f4fc;
  font-size: 20px;
  font-weight: 750;
  letter-spacing: -.025em;
}
.md-sidenav-left .sidenav-brand span {
  margin-top: 4px;
  color: #9e9ab0;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .13em;
}
.md-sidenav-left .nav-close {
  width: 32px;
  height: 32px;
  margin-right: 11px;
  border: 0;
  border-radius: 10px;
  background: rgba(255,255,255,.055);
  color: #d9d5e7;
}
.md-sidenav-left md-content { background: #151721; }
.sidebar-user-card {
  margin: 14px 13px 9px;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 14px;
  background: #202230;
  box-shadow: none;
}
.sidebar-user-card::after { display: none; }
.sidebar-user-card:hover { transform: none; background: #242737; box-shadow: none; }
.sidebar-user-card .lup-avatar { outline: 1px solid rgba(188,177,255,.42); outline-offset: 2px; }
.sidebar-user-card > .material-icons { color: #9690aa; }
.md-sidenav-left md-list { padding: 9px 10px 18px; }
.md-sidenav-left .sidebar-section-title {
  margin: 17px 9px 6px;
  color: #777287;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .14em;
}
.md-sidenav-left .sidebar-legal-title { margin-top: 20px; padding-top: 15px; border-top-color: rgba(255,255,255,.07); }
.md-sidenav-left md-list-item {
  min-height: 48px;
  margin: 2px 0;
  border: 1px solid transparent;
  border-radius: 11px;
  background: transparent;
  transition: background .16s ease, border-color .16s ease;
}
.md-sidenav-left md-list-item::before { left: 7px; top: 14px; bottom: 14px; width: 2px; border-radius: 2px; box-shadow: none; }
.md-sidenav-left md-list-item:hover {
  transform: none;
  border-color: rgba(255,255,255,.07);
  background: rgba(255,255,255,.045);
}
.md-sidenav-left md-list-item:hover::before { background: #a99af0; box-shadow: none; }
.md-sidenav-left md-list-item p { color: #e4e1ec; font-size: 14px; font-weight: 600; }
.md-sidenav-left md-list-item .nav-icon,
.md-sidenav-left md-list-item.nav-discover .nav-icon,
.md-sidenav-left md-list-item.nav-profile .nav-icon,
.md-sidenav-left md-list-item.nav-friends .nav-icon,
.md-sidenav-left md-list-item.nav-settings .nav-icon,
.md-sidenav-left md-list-item.nav-account .nav-icon,
.md-sidenav-left md-list-item.nav-profile-settings .nav-icon,
.md-sidenav-left md-list-item.nav-logout .nav-icon {
  width: 30px;
  height: 30px;
  margin-right: 11px;
  border-radius: 9px;
  background: rgba(255,255,255,.055);
  color: #c9c4d8;
  box-shadow: none;
  transform: none;
}
.md-sidenav-left md-list-item .nav-icon::after { display: none; }
.md-sidenav-left md-list-item:hover .nav-icon { transform: none; box-shadow: none; color: #ece9f8; }
.md-sidenav-left md-list-item.nav-logout { margin-top: 7px; border-color: transparent; background: transparent; }
.md-sidenav-left md-list-item.nav-logout p,
.md-sidenav-left md-list-item.nav-logout .nav-icon { color: #c9b4bd; }

/* Night Navigation: one calm rail, with colour reserved for meaning and interaction. */
.md-sidenav-left { border-right-color:rgba(177,164,233,.15); background:linear-gradient(180deg,#1c1d2a 0,#151721 28%,#11131c 100%); box-shadow:18px 0 42px rgba(0,0,0,.30); }.md-sidenav-left .sidenav-brand { min-height:78px; background:linear-gradient(112deg,rgba(112,90,197,.30),rgba(25,30,53,.72)); border-bottom-color:rgba(220,214,255,.10); }.md-sidenav-left .sidenav-brand .md-toolbar-tools { height:78px; }.md-sidenav-left .sidenav-brand h1 { font-size:21px; font-weight:720; letter-spacing:.015em; }.md-sidenav-left .sidenav-brand span { color:#b8b2cb; letter-spacing:.11em; }.md-sidenav-left md-content { background:radial-gradient(circle at 0 20%,rgba(124,102,222,.10),transparent 23%),linear-gradient(180deg,#171925,#11131c); }
.sidebar-user-card { margin:16px 14px 12px; padding:11px 12px; border-color:rgba(216,208,255,.13); border-radius:12px; background:rgba(255,255,255,.035); box-shadow:inset 0 1px 0 rgba(255,255,255,.06); }.sidebar-user-card:hover { background:rgba(255,255,255,.07); }.sidebar-user-card > div strong { color:#f0edf8; font-size:14px; }.sidebar-user-card > div span { color:#aaa4ba; font-size:10px; }
.md-sidenav-left md-list { padding:7px 12px 20px; }.md-sidenav-left .sidebar-section-title { margin:18px 8px 6px; color:#8f899f; font-size:8px; letter-spacing:.17em; }.md-sidenav-left .sidebar-legal-title { margin-top:22px; padding-top:14px; }
.md-sidenav-left md-list-item { min-height:44px; margin:1px 0; border:0; border-radius:8px; background:transparent; }.md-sidenav-left md-list-item::before { left:0; top:12px; bottom:12px; width:2px; border-radius:0 2px 2px 0; }.md-sidenav-left md-list-item p { color:#dcd8e6; font-size:13px; font-weight:620; }.md-sidenav-left md-list-item .nav-icon,.md-sidenav-left md-list-item.nav-discover .nav-icon,.md-sidenav-left md-list-item.nav-profile .nav-icon,.md-sidenav-left md-list-item.nav-friends .nav-icon,.md-sidenav-left md-list-item.nav-settings .nav-icon,.md-sidenav-left md-list-item.nav-account .nav-icon,.md-sidenav-left md-list-item.nav-profile-settings .nav-icon,.md-sidenav-left md-list-item.nav-logout .nav-icon { width:25px; height:25px; margin-right:13px; border-radius:0; background:transparent; color:#aaa5bb; font-size:19px; }.md-sidenav-left md-list-item:hover { border:0; background:linear-gradient(90deg,rgba(171,151,255,.15),transparent 83%); }.md-sidenav-left md-list-item:hover::before { background:#c3b5ff; box-shadow:0 0 11px rgba(195,181,255,.55); }.md-sidenav-left md-list-item:hover .nav-icon { color:#e3ddff; }
.md-sidenav-left md-list-item.nav-discover .nav-icon { color:#9cc7f0; }.md-sidenav-left md-list-item.nav-profile .nav-icon { color:#b8b0cf; }.md-sidenav-left md-list-item.nav-settings .nav-icon { color:#c4aeff; }.md-sidenav-left md-list-item.nav-account .nav-icon { color:#a7d8e9; }.md-sidenav-left md-list-item.nav-profile-settings .nav-icon { color:#dfc29a; }.md-sidenav-left md-list-item.nav-friends .nav-icon { color:#e8a5c2; }.md-sidenav-left md-list-item.nav-settings { border-color:transparent; background:transparent; }.md-sidenav-left md-list-item.nav-logout { margin-top:10px; }

/* Three equal place controls: location, conversation and the people present. */
.location-page md-tabs md-tabs-wrapper {
  padding: 7px 9px 0;
  background: #171827;
}
.location-page md-tabs md-tab-item {
  display: flex;
  flex: 1 1 0;
  min-width: 0;
  min-height: 55px;
  margin: 0 2px;
  padding: 0;
  border-radius: 13px 13px 0 0;
  color: #aaa5ba;
  transition: color .18s ease, background .18s ease;
}
.location-page md-tabs md-tab-item .md-tab-label {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-width: 0;
}
.location-page md-tabs md-tab-item .md-tab-label::before {
  font-family: 'Material Icons';
  font-size: 20px;
  font-weight: normal;
  line-height: 1;
  color: #9c94b7;
  transition: transform .2s cubic-bezier(.18,.8,.25,1), color .18s ease;
}
.location-page md-tabs md-tab-item:nth-child(1) .md-tab-label::before { content: 'place'; }
.location-page md-tabs md-tab-item:nth-child(2) .md-tab-label::before { content: 'forum'; }
.location-page md-tabs md-tab-item:nth-child(3) .md-tab-label::before { content: 'groups'; }
.location-page md-tabs md-tab-item:not([disabled]):hover { background: rgba(255,255,255,.05); }
.location-page md-tabs md-tab-item.md-active {
  background: linear-gradient(180deg,rgba(143,118,255,.18),rgba(143,118,255,.045));
  color: #f8f7ff;
}
.location-page md-tabs md-tab-item.md-active .md-tab-label::before {
  color: #c9bcff;
  transform: translateY(-1px) scale(1.13);
}
.location-page md-tabs md-tab-item[disabled] { opacity: .48; }
.location-page md-tabs md-ink-bar { margin: 0 2px; }
@media (max-width:350px) {
  .location-page md-tabs md-tabs-wrapper { padding-right: 5px; padding-left: 5px; }
  .location-page md-tabs md-tab-item .md-tab-label { gap: 4px; }
  .location-page md-tabs md-tab-item .md-tab-label::before { font-size: 18px; }
}

/* The Online area is a live presence board, not a plain contact list. */
md-list.usernavigation { padding: 12px 11px 20px; }
md-list.usernavigation .location-presence-heading {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 66px;
  margin: 0 1px 10px;
  padding: 10px 12px;
  border: 1px solid rgba(170,151,255,.20);
  border-radius: 16px;
  background: linear-gradient(135deg,rgba(116,88,223,.23),rgba(47,130,198,.12));
}
md-list.usernavigation .location-presence-heading > .material-icons {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 12px;
  background: rgba(188,171,255,.20);
  color: #ded5ff;
  font-size: 20px;
}
md-list.usernavigation .location-presence-heading strong {
  display: block;
  color: #f6f3ff;
  font-size: 13px;
  font-weight: 800;
}
md-list.usernavigation .location-presence-heading span {
  display: block;
  margin-top: 3px;
  color: #c4bdd9;
  font-size: 10px;
}
md-list.usernavigation .presence-person {
  min-height: 62px;
  margin: 6px 1px;
  padding: 5px 9px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 15px;
  background: rgba(255,255,255,.04);
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
}
md-list.usernavigation .presence-person:hover {
  transform: translateY(-2px);
  border-color: rgba(177,160,255,.26);
  background: rgba(129,102,231,.12);
}
md-list.usernavigation .presence-person .presence-avatar {
  width: 42px;
  height: 42px;
  margin-right: 10px;
  border-radius: 50%;
  outline: 2px solid rgba(175,159,255,.38);
  outline-offset: 2px;
}
md-list.usernavigation .presence-person .presence-avatar img { width: 42px; height: 42px; }
md-list.usernavigation .presence-person-copy .username { color: #f4f2fa; font-size: 13px; }
md-list.usernavigation .presence-actions { display: flex; align-items: center; gap: 3px; }
md-list.usernavigation .presence-actions .usericon {
  width: 29px;
  height: 29px;
  border-radius: 9px;
  background-color: rgba(255,255,255,.07);
  background-size: 17px 17px;
  background-position: center;
}

/* A compact room identity belongs in the top bar, not as a heavy page title. */
.lup-top-bar .location-top-identity {
  display: flex;
  align-items: center;
  min-width: 0;
  margin-left: 3px;
}
.lup-top-bar .location-top-icon {
  display: grid;
  place-items: center;
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  margin-right: 9px;
  border: 1px solid rgba(199,187,255,.24);
  border-radius: 11px;
  background: linear-gradient(145deg,rgba(143,117,242,.58),rgba(76,126,202,.48));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.20);
}
.lup-top-bar .location-top-icon .material-icons { color: #f9f7ff; font-size: 18px; }
.lup-top-bar .location-top-copy { min-width: 0; }
.lup-top-bar .location-top-copy .room-name {
  overflow: hidden;
  color: #f7f5ff;
  font-size: 14px;
  font-weight: 780;
  line-height: 17px;
  letter-spacing: -.01em;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.lup-top-bar .location-top-copy > span {
  display: flex;
  align-items: center;
  gap: 3px;
  margin-top: 1px;
  color: #aaa4c0;
  font-size: 9px;
  font-weight: 750;
  letter-spacing: .045em;
  text-transform: uppercase;
}
.lup-top-bar .location-top-copy > span .material-icons { color: #75dcb1; font-size: 9px; }
@keyframes lup-place-arrive-right {
  0% { opacity: .18; transform: translate3d(24px,6px,0) rotate(1deg) scale(.96); }
  72% { opacity: 1; transform: translate3d(-2px,-1px,0) rotate(0) scale(1.008); }
  100% { opacity: 1; transform: none; }
}
@keyframes lup-place-arrive-left {
  0% { opacity: .18; transform: translate3d(-24px,6px,0) rotate(-1deg) scale(.96); }
  72% { opacity: 1; transform: translate3d(2px,-1px,0) rotate(0) scale(1.008); }
  100% { opacity: 1; transform: none; }
}
@keyframes lup-place-detail-rise {
  from { opacity: 0; transform: translateY(15px) scale(.96); }
  to { opacity: 1; transform: none; }
}
@keyframes lup-location-stage {
  0% { opacity: .22; transform: translateY(14px) scale(.93); }
  70% { opacity: 1; transform: translateY(-2px) scale(1.012); }
  100% { opacity: 1; transform: none; }
}
@keyframes lup-location-seal {
  0% { opacity: 0; transform: translateY(18px) scale(.48) rotate(-15deg); }
  72% { opacity: 1; transform: translateY(-3px) scale(1.1) rotate(3deg); }
  100% { opacity: 1; transform: none; }
}
@keyframes lup-location-chip {
  0% { opacity: 0; transform: scale(.55); }
  75% { opacity: 1; transform: scale(1.09); }
  100% { opacity: 1; transform: none; }
}

/* Two distinct real-world actions: a scanned venue Cuddle and a precise route. */
.nearby .distrat .location-cuddles {
  overflow: visible;
  border: 1px solid rgba(255,198,222,.52);
  border-radius: 18px 18px 18px 8px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.20), transparent 28%),
    repeating-linear-gradient(90deg, transparent 0 7px, rgba(255,255,255,.055) 7px 8px),
    linear-gradient(145deg, #6e315b 0%, #b64b80 52%, #e77e9f 100%);
  box-shadow: 0 5px 0 #5d294e, 0 15px 25px rgba(0,0,0,.29), 0 0 0 4px rgba(237,115,167,.08), inset 0 1px 0 rgba(255,255,255,.40);
}
.nearby .distrat .location-cuddles::before {
  content:'';
  position:absolute;
  inset:9px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:11px 11px 11px 4px;
  background:repeating-linear-gradient(90deg, rgba(255,255,255,.12) 0 2px, transparent 2px 6px);
  opacity:.52;
}
.nearby .distrat .location-cuddles > .material-icons {
  position:relative;
  z-index:1;
  font-size:32px;
  filter:drop-shadow(0 2px 0 rgba(84,29,64,.55));
}
.nearby .distrat .location-cuddles::after {
  top:calc(100% + 9px);
  color:#ffc7dc;
  text-shadow:0 1px 6px rgba(0,0,0,.55);
}
.nearby .distrat .location-cuddles strong {
  z-index:2;
  border-color:#271d31;
  border-radius:50%;
  background:linear-gradient(145deg,#fff0bd,#f1a85c);
  box-shadow:0 3px 0 #885044,0 7px 12px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.6);
  color:#56322a;
}
.nearby .distrat .distance a::before {
  border:1px solid rgba(184,240,255,.58);
  border-radius:50% 50% 50% 16px;
  background:
    radial-gradient(circle at 32% 27%, rgba(255,255,255,.82) 0 6%, transparent 7%),
    radial-gradient(circle at 50% 52%, rgba(255,255,255,.19) 0 27%, transparent 28%),
    linear-gradient(145deg,#70e0f0 0%,#3e8ed1 53%,#4851ab 100%);
  box-shadow:0 5px 0 #31549c,0 16px 25px rgba(0,0,0,.29),0 0 0 4px rgba(91,205,240,.075),inset 0 2px 1px rgba(255,255,255,.5);
  color:#fff;
  text-shadow:0 2px 0 rgba(31,67,138,.45);
}
.nearby .distrat .distance a:hover::before { box-shadow:0 7px 0 #31549c,0 20px 28px rgba(0,0,0,.31),0 0 0 7px rgba(91,205,240,.12),inset 0 2px 1px rgba(255,255,255,.5); }
@media (max-width:600px) {
  .nearby .distrat .location-cuddles { border-radius:22px 22px 22px 10px; }
  .nearby .distrat .location-cuddles::before { inset:11px; border-radius:14px 14px 14px 6px; }
  .nearby .distrat .location-cuddles > .material-icons { font-size:38px; }
  .nearby .distrat .distance a::before { border-radius:50% 50% 50% 19px; }
}

/* Keep the route mark clean: distance is a separate readout, never squeezed into the pin. */
.nearby .distrat .distance a { width:64px; min-width:64px; gap:0; }
.nearby .distrat .distance a::before { flex:0 0 auto; }
.nearby .distrat .distance a > span {
  position:static;
  display:block;
  width:max-content;
  max-width:132px;
  margin-top:7px;
  padding:3px 6px;
  overflow:hidden;
  border:1px solid rgba(177,220,255,.17);
  border-radius:999px;
  background:rgba(20,31,65,.54);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  color:#c9ebff;
  font-size:8px;
  font-weight:850;
  letter-spacing:.045em;
  line-height:1.1;
  text-overflow:ellipsis;
  white-space:nowrap;
}
@media (min-width:381px) {
  .nearby .distrat .distance { left:auto; right:14px; }
}
@media (max-width:380px) {
  .nearby .distrat .distance { left:auto; right:10px; }
}
@media (max-width:600px) {
  /* Remove the old decorative divider: it cut across the new action marks. */
  .nearby .roominfo { min-height:432px; }
  .nearby .roominfo::before { display:none; }
  .nearby .distrat .distance { z-index:3; }
}

/* Location actions: one flat, centred pair instead of several competing card effects. */
.nearby .distrat {
  position:relative;
  top:25px;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  gap:58px;
  width:calc(100% - 26px);
  height:98px;
  margin:12px 13px 0;
  padding:0;
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.nearby .distrat .location-cuddles,
.nearby .distrat .distance {
  position:relative;
  top:auto;
  right:auto;
  bottom:auto;
  left:auto;
  display:flex;
  align-items:center;
  justify-content:center;
  width:60px;
  min-width:60px;
  height:60px;
  margin:0;
  padding:0;
  transform:none;
}
.nearby .distrat .location-cuddles {
  overflow:visible;
  border:1px solid rgba(255,194,219,.52);
  border-radius:14px;
  background:#b74e79;
  box-shadow:none;
  color:#fff;
}
.nearby .distrat .location-cuddles::before {
  content:'';
  position:absolute;
  inset:10px;
  border:2px solid rgba(255,255,255,.82);
  border-radius:5px;
  background:linear-gradient(90deg,transparent 0 23%,rgba(255,255,255,.82) 23% 34%,transparent 34% 66%,rgba(255,255,255,.82) 66% 77%,transparent 77%);
  opacity:.7;
}
.nearby .distrat .location-cuddles::after { content:none; }
.nearby .distrat .location-cuddles > .material-icons { position:relative; z-index:1; font-size:34px; filter:none; }
.nearby .distrat .location-cuddles:hover { transform:none; filter:brightness(1.08); }
.nearby .distrat .location-cuddles strong {
  z-index:2;
  right:-8px;
  bottom:-8px;
  min-width:21px;
  height:21px;
  border:2px solid #262738;
  border-radius:50%;
  background:#f4c27d;
  box-shadow:none;
  color:#4e3540;
  font-size:10px;
}
.nearby .distrat .distance { align-items:flex-start; }
.nearby .distrat .distance p { width:100%; margin:0; }
.nearby .distrat .distance a {
  display:flex;
  flex-direction:column;
  align-items:center;
  width:60px;
  min-width:60px;
  gap:6px;
  color:#cceeff;
  text-decoration:none;
}
.nearby .distrat .distance a::before {
  display:grid;
  place-items:center;
  flex:0 0 60px;
  width:60px;
  height:60px;
  border:1px solid rgba(178,235,255,.62);
  border-radius:50%;
  background:#397fb5;
  box-shadow:none;
  color:#fff;
  font-size:33px;
  line-height:1;
  text-shadow:none;
}
.nearby .distrat .distance a:hover::before { transform:none; filter:brightness(1.10); box-shadow:none; }
.nearby .distrat .distance a::after { content:none; }
.nearby .distrat .distance a > span {
  position:static;
  display:block;
  width:max-content;
  max-width:126px;
  margin:0;
  padding:0;
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  transform:none;
  color:#cfeaff;
  font-size:9px;
  font-weight:800;
  letter-spacing:.03em;
  line-height:1.2;
  text-align:center;
  text-overflow:clip;
  white-space:nowrap;
}
.nearby .roominfo::before { display:none; }
.nearby .distrat { isolation:isolate; z-index:4; }
.nearby .distrat .distance p {
  width:100%;
  overflow:visible;
  text-overflow:clip;
  white-space:normal;
}
@media (max-width:600px) {
  .nearby .roominfo { min-height:432px; }
  .nearby .distrat { top:21px; gap:80px; height:96px; }
  .nearby .distrat .location-cuddles,
  .nearby .distrat .distance { transform:translateY(70px); }
  .nearby .distrat .location-cuddles:hover { transform:translateY(70px); }
  .nearby .distrat .location-cuddles,
  .nearby .distrat .distance,
  .nearby .distrat .distance a::before { width:60px; height:60px; }
  .nearby .distrat .distance a::before { flex-basis:60px; border-radius:50%; font-size:33px; }
  .nearby .distrat .location-cuddles { border-radius:14px; }
  .nearby .distrat .distance { z-index:1; }
}

/* Discovery categories: a compact, legible control strip rather than tiny loose icons. */
.location-categories { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:4px; margin:8px 8px 4px; padding:5px; border:1px solid rgba(215,208,255,.11); border-radius:17px; background:rgba(18,20,32,.72); box-shadow:inset 0 1px 0 rgba(255,255,255,.06); }
.location-categories button { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:0; min-height:54px; padding:5px 2px 4px; border:1px solid transparent; border-radius:12px; background:transparent; color:#aaa5bc; box-shadow:none; transition:background .16s ease,border-color .16s ease,color .16s ease; }
.location-categories button .material-icons { display:grid; place-items:center; width:25px; height:25px; margin:0; padding:0; border:1px solid currentColor; border-radius:8px; background:rgba(255,255,255,.025); box-shadow:none; font-size:16px; line-height:1; opacity:1; }
.location-categories button span { width:100%; margin-top:5px; overflow:hidden; color:inherit; font-size:8px; font-weight:800; letter-spacing:.01em; line-height:1.05; text-align:center; text-overflow:ellipsis; white-space:nowrap; }
.location-categories button.active { border-color:rgba(214,205,255,.22); background:rgba(255,255,255,.075); color:#faf8ff; }
.location-categories button.active::after { right:22%; bottom:3px; left:22%; width:auto; height:2px; border-radius:2px; background:#e0d8ff; box-shadow:none; }
.location-categories button:nth-child(1) { color:#b9a7ff; }.location-categories button:nth-child(2) { color:#a8bddc; }.location-categories button:nth-child(3) { color:#e7b887; }.location-categories button:nth-child(4) { color:#e2a1dc; }.location-categories button:nth-child(5) { color:#9bd5dc; }.location-categories button:nth-child(6) { color:#daaabd; }

/* Nearby actions: deliberately flat, quiet and precise. */
.nearby .distrat { gap:26px; }
.nearby .distrat .location-cuddles,
.nearby .distrat .distance { width:52px; min-width:52px; height:52px; transform:none; }
.nearby .distrat .location-cuddles {
  border:1px solid rgba(255,183,211,.46);
  border-radius:12px;
  background:rgba(183,78,121,.16);
  color:#f6bed4;
}
.nearby .distrat .location-cuddles::before { display:none; }
.nearby .distrat .location-cuddles > .material-icons { font-size:29px; }
.nearby .distrat .location-cuddles strong {
  right:-6px; bottom:-6px; min-width:18px; height:18px;
  border:1px solid #28283a; background:#f3bfd1; color:#442c3b;
  font-size:9px;
}
.nearby .distrat .distance { align-items:center; }
.nearby .distrat .distance a { width:52px; min-width:52px; gap:5px; color:#cfe9f7; }
.nearby .distrat .distance a::before { display:none; content:none; }
.nearby .distrat .distance a > .material-icons {
  display:grid; place-items:center; width:52px; height:52px;
  border:1px solid rgba(158,220,242,.50); border-radius:50%;
  background:rgba(68,137,180,.16); color:#9edcf2; font-size:28px;
}
.nearby .distrat .distance a > span { color:#cfe9f7; font-size:10px; font-weight:750; letter-spacing:0; }
/* Match the QR mark's quiet live accent: the route pin gets a thin travelling
   ring, while the distance text and the actual link remain untouched. */
.nearby .distrat .distance a { position:relative; isolation:isolate; }
.nearby .distrat .distance a::after {
  content:none;
}
@media (max-width:600px) {
  .nearby .distrat .distance { transform:translateY(70px); }
}
@media (max-width:600px) {
  .nearby .distrat { gap:54px; }
  .nearby .distrat .location-cuddles,
  .nearby .distrat .distance { transform:translateY(70px); }
  .nearby .distrat .location-cuddles:hover { transform:translateY(70px); }
}
.location-categories button.active .material-icons { background:currentColor; color:#222334; border-color:currentColor; }
@media (max-width:380px) { .location-categories { gap:2px; margin-right:5px; margin-left:5px; padding:4px; }.location-categories button { min-height:50px; }.location-categories button .material-icons { width:23px; height:23px; font-size:15px; }.location-categories button span { font-size:7px; } }

/* Keep the filter strip permanently present; selection only changes its emphasis. */
.location-categories { position:relative; z-index:6; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); min-height:58px; margin:5px 8px 2px; padding:4px; border-radius:13px; background:rgba(30,31,47,.82); }
.location-categories button { display:flex; min-height:50px; border-radius:10px; color:#cbc6dc; }
.location-categories button .material-icons { width:23px; height:23px; border:0; border-radius:0; background:transparent; color:inherit; font-size:20px; }
.location-categories button span { margin-top:4px; color:inherit; font-size:7px; }
.location-categories button.active { background:rgba(255,255,255,.09); color:#fff; }
.location-categories button.active .material-icons { background:transparent; color:inherit; }
.location-categories button.active::after { content:''; right:30%; bottom:3px; left:30%; height:2px; background:currentColor; }

/* Presence uses a calm live-status treatment, separate from the category controls. */
.nearby .room-user-preview {
  display:flex;
  align-items:center;
  min-height:42px;
  margin-right:18px;
  margin-left:18px;
  padding:6px 9px;
  border:1px solid rgba(104,219,166,.20);
  border-radius:15px;
  background:linear-gradient(90deg,rgba(65,180,130,.16),rgba(255,255,255,.035) 62%,rgba(255,255,255,.018));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
}
.nearby .room-user-preview::before { content:''; flex:0 0 7px; width:7px; height:7px; margin:0 8px 0 2px; border-radius:50%; background:#65d9a2; box-shadow:0 0 0 4px rgba(101,217,162,.11); }
.nearby .room-user-preview .lup-avatar { width:28px; height:28px; margin-left:-7px; border:2px solid #252c3c; box-shadow:none; }
.nearby .room-user-preview .lup-avatar:first-of-type { margin-left:0; }
.nearby .room-user-preview .lup-avatar img { width:28px; height:28px; }
.nearby .room-user-preview .more-users { width:28px; height:28px; margin-left:-7px; border:2px solid #252c3c; border-radius:50%; background:#334d59; box-shadow:none; }
.nearby .room-user-preview .more-users b { color:#d7f6e5; font-size:9px; line-height:24px; }
.nearby .room-presence-count { margin-left:auto; padding:5px 7px; border:1px solid rgba(110,224,172,.24); border-radius:999px; background:rgba(52,175,119,.14); box-shadow:none; color:#c6f4db; font-size:9px; font-weight:800; }
.nearby .room-presence-count .material-icons { margin-right:3px; color:#7de6af; font-size:14px; }
@media (max-width:600px) { .nearby .room-user-preview { margin-right:12px; margin-left:18px; padding:6px 8px; }.nearby .room-presence-count { font-size:8px; } }

/* Registration is the same calm LinkUUp entry experience as login. */
.register-page > md-content { min-height:var(--lup-viewport-height,100dvh); background:linear-gradient(160deg,#1d1f31 0%,#151724 58%,#11121d 100%); }
.register-page .register-brand-stage { min-height:220px; }
.register-page .register-panel { width:min(88%,410px); box-sizing:border-box; margin:0 auto; padding:22px 0 14px; }
.register-page .register-title { margin:0 0 18px; color:#f7f5ff; font-size:25px; font-weight:750; letter-spacing:-.03em; text-align:center; }
.register-page .register-panel md-input-container { margin:0 0 12px; padding:0 14px; border:1px solid rgba(255,255,255,.12); border-radius:14px; background:rgba(255,255,255,.055); }
.register-page .register-panel md-input-container label { color:#bcb5d1; }
.register-page .register-panel md-input-container input { color:#faf9ff; }
.register-page .register-panel md-input-container.md-input-focused { border-color:rgba(173,154,255,.70); background:rgba(128,100,231,.12); }
.register-page .register-panel .tos-line { margin:5px 12px 17px; color:#c9c3d9; font-size:11px; line-height:1.4; }
.register-page .register-panel .lup-tos-line a { color:#cbbdff; }
.register-page .register-panel > section { width:100%; margin:0; padding:0; }
.register-page .register-panel .login-button { width:100%; height:48px; margin:0 0 9px; border:1px solid rgba(233,227,255,.26); border-radius:14px; background:linear-gradient(105deg,#8d75e5,#5a94d8); box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 10px 20px rgba(42,48,113,.24); color:#fff; font-size:14px; font-weight:800; }
.register-page .register-panel .google-button { display:block; width:100%; height:42px; margin:0 0 9px; border:1px solid rgba(195,222,255,.16); border-radius:14px; background:rgba(7,13,27,.38); box-shadow:none; color:#eaf4ff; font-size:12px; font-weight:740; text-transform:none; }
.register-page .register-panel .google-button:hover { background:rgba(116,163,215,.13); }
.register-page .register-panel .backtologin { width:100%; height:42px; margin:0; border:1px solid rgba(255,255,255,.12); border-radius:14px; background:rgba(255,255,255,.045); color:#ded9ec; font-size:12px; font-weight:750; }
.register-page .login-bottom { width:min(88%,410px); margin:8px auto 0; padding-bottom:18px; }

/* Final nearby-presence layout override for phone breakpoints. */
.nearby .room-user-preview { top:35px; min-height:58px; margin:8px 30px 0 14px; padding:8px 12px; border:1px solid rgba(129,227,181,.18); border-radius:18px; background:linear-gradient(110deg,rgba(60,168,122,.17),rgba(51,64,94,.20) 62%,rgba(255,255,255,.025)); box-shadow:0 10px 22px rgba(0,0,0,.14),inset 3px 0 0 #69d9a4,inset 0 1px 0 rgba(255,255,255,.09); }
.nearby .room-user-preview .lup-avatar { width:42px; height:42px; margin-left:-12px; border:3px solid #202838; box-shadow:0 5px 12px rgba(0,0,0,.26); }.nearby .room-user-preview .lup-avatar:first-child { margin-left:0; }.nearby .room-user-preview .lup-avatar img { width:42px; height:42px; }
.nearby .room-user-preview .more-users { flex-basis:42px; width:42px; height:42px; margin-left:-10px; border:3px solid #202838; background:linear-gradient(145deg,#70d8ad,#4c86c5); }.nearby .room-user-preview .more-users b { line-height:36px; font-size:11px; }.nearby .room-presence-count { padding:6px 9px; border-radius:12px; background:rgba(13,37,34,.37); color:#caf7df; font-size:10px; }

/* Nearby people, refined: a light rail with an overlapping group of faces. */
.nearby .room-user-preview { top:37px; min-height:54px; margin-left:25px; margin-right:18px; padding:7px 10px 7px 13px; border:0; border-radius:0; background:linear-gradient(90deg,rgba(93,216,164,.12),rgba(255,255,255,.018) 66%,transparent); box-shadow:none; }
.nearby .room-user-preview::before { content:''; position:absolute; top:7px; bottom:7px; left:0; width:2px; border-radius:2px; background:linear-gradient(#83e2b4,rgba(101,195,237,.42)); box-shadow:0 0 11px rgba(104,224,170,.35); }
.nearby .room-user-preview .lup-avatar { width:38px; height:38px; margin-left:-14px; border:2px solid #202838; box-shadow:0 4px 10px rgba(0,0,0,.22); }.nearby .room-user-preview .lup-avatar img { width:38px; height:38px; }.nearby .room-user-preview .lup-avatar:first-child { margin-left:0; }
.nearby .room-user-preview .more-users { flex-basis:38px; width:38px; height:38px; margin-left:-12px; border:2px solid #202838; border-radius:50%; background:linear-gradient(145deg,#84dcba,#527fc0); box-shadow:0 4px 10px rgba(0,0,0,.22); }.nearby .room-user-preview .more-users b { line-height:34px; font-size:10px; }
.nearby .room-presence-count { margin-left:auto; padding:5px 7px; border:0; border-radius:10px; background:rgba(13,37,34,.28); box-shadow:none; }

/* Nearby people: faces resting on a single, quiet rail — no card or green frame. */
.nearby .room-user-preview {
  top:39px;
  min-height:64px;
  margin:7px 18px 0 25px;
  padding:4px 9px 10px;
  align-items:flex-start;
  overflow:visible;
  background:transparent;
}
.nearby .room-user-preview::before {
  top:auto;
  right:9px;
  bottom:4px;
  left:9px;
  width:auto;
  height:1px;
  border-radius:0;
  background:linear-gradient(90deg,transparent,rgba(218,224,255,.42) 16%,rgba(157,184,245,.62) 50%,rgba(218,224,255,.30) 84%,transparent);
  box-shadow:0 0 8px rgba(144,168,236,.16);
}
.nearby .room-user-preview .lup-avatar {
  width:46px;
  height:46px;
  margin-top:2px;
  margin-left:-16px;
  border:2px solid #202838;
  border-radius:50%;
  box-shadow:0 5px 12px rgba(0,0,0,.26);
  transition:transform .22s ease, box-shadow .22s ease;
}
.nearby .room-user-preview .lup-avatar img { width:46px; height:46px; }
.nearby .room-user-preview .lup-avatar:first-child { margin-left:0; transform:translateY(0); }
.nearby .room-user-preview .lup-avatar:nth-child(2) { transform:translateY(4px); }
.nearby .room-user-preview .lup-avatar:nth-child(3) { transform:translateY(1px); }
.nearby .room-user-preview .lup-avatar:nth-child(4) { transform:translateY(5px); }
.nearby .room-user-preview .lup-avatar:nth-child(5) { transform:translateY(2px); }
.nearby .room-user-preview .lup-avatar:nth-child(6) { transform:translateY(5px); }
.nearby .room-user-preview .lup-avatar:hover { transform:translateY(-4px) scale(1.06); box-shadow:0 9px 16px rgba(0,0,0,.34); }
.nearby .room-user-preview .more-users { flex-basis:42px; width:42px; height:42px; margin-top:5px; margin-left:-13px; border:2px solid #202838; background:linear-gradient(145deg,#657aa7,#48566f); }
.nearby .room-user-preview .more-users b { line-height:38px; }
.nearby .room-presence-count { margin-top:8px; padding:4px 6px; background:transparent; color:#d8deed; }
.nearby .room-presence-count .material-icons { color:#aebce0; }

/* The avatar directive uses a background-image div, not an img element.  Give
   that real image the full circle and suppress the old blue gender backdrop. */
.nearby .room-user-preview .lup-avatar {
  box-sizing:border-box;
  width:48px;
  height:48px;
  padding:2px;
  background:transparent;
}
.nearby .room-user-preview .lup-avatar .img,
.nearby .room-user-preview .lup-avatar span {
  display:block;
  width:40px;
  height:40px;
  border-radius:50%;
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover;
}
.nearby .room-user-preview .lup-avatar span { background:#31394b; }


.nearby .room-user-preview .lup-avatar span { display:none; }
.nearby .room-user-preview .lup-avatar { box-shadow:none; }

/* The small people symbol answers one question at a glance: is anyone here? */
.nearby .room-presence-count .material-icons {
  display:grid;
  place-items:center;
  width:19px;
  height:19px;
  margin-right:4px;
  border-radius:50%;
  background:rgba(173,188,224,.10);
  color:#9da9c2;
  font-size:13px;
  transition:color .25s ease, background .25s ease, box-shadow .25s ease;
}
.nearby .room-presence-count.has-visitors .material-icons {
  background:rgba(86,221,151,.16);
  color:#82eeb1;
  box-shadow:0 0 0 3px rgba(86,221,151,.08),0 0 12px rgba(86,221,151,.36);
  animation:lup-presence-pulse 2.1s ease-in-out infinite;
}
@keyframes lup-presence-pulse {
  0%,100% { box-shadow:0 0 0 3px rgba(86,221,151,.08),0 0 9px rgba(86,221,151,.22); }
  50% { box-shadow:0 0 0 5px rgba(86,221,151,.04),0 0 15px rgba(86,221,151,.48); }
}
@media (prefers-reduced-motion:reduce) { .nearby .room-presence-count.has-visitors .material-icons { animation:none; } }

/* Gallery add action: a compact camera invitation, not a technical drop zone. */
.profile-page .gallery-add-tile {
  position:relative;
  isolation:isolate;
  gap:7px;
  border:1px solid rgba(194,202,231,.18);
  border-radius:18px;
  background:radial-gradient(circle at 50% 35%,rgba(139,158,217,.17),transparent 33%),linear-gradient(145deg,rgba(44,51,73,.90),rgba(26,31,45,.88));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 9px 18px rgba(0,0,0,.16);
  color:#dce5fb;
}
.profile-page .gallery-add-tile::before { display:none; }
.profile-page .gallery-add-tile .material-icons {
  width:38px;
  height:38px;
  border:1px solid rgba(225,232,255,.28);
  border-radius:13px;
  background:linear-gradient(145deg,#8298d7,#5e75aa);
  box-shadow:0 7px 13px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.30);
  font-size:21px;
}
.profile-page .gallery-add-tile span { display:none; }
.profile-page .gallery-add-tile:hover { border-color:rgba(209,220,255,.46); background:radial-gradient(circle at 50% 35%,rgba(150,174,243,.24),transparent 37%),linear-gradient(145deg,rgba(54,63,89,.96),rgba(28,34,50,.94)); transform:translateY(-2px); }

/* Venue Cuddle: a crisp QR tile and a calm, readable counter. */
.nearby .distrat .location-cuddles {
  overflow:visible;
  border:1px solid #eaa2c0;
  border-radius:12px;
  background:#6b3656;
  box-shadow:none;
  color:#ffe8f1;
}
.nearby .distrat .location-cuddles::before,
.nearby .distrat .location-cuddles::after { display:none; content:none; }
.nearby .distrat .location-cuddles > .material-icons {
  font-size:28px;
  filter:none;
  text-shadow:none;
}
.nearby .distrat .location-cuddles strong {
  right:-7px;
  bottom:-7px;
  display:grid;
  place-items:center;
  min-width:20px;
  height:20px;
  padding:0 3px;
  border:2px solid #252939;
  border-radius:50%;
  background:#f5c9d9;
  box-shadow:none;
  color:#412a37;
  font-size:10px;
  font-weight:900;
  line-height:1;
}
.nearby .distrat .location-cuddles:hover { transform:none; filter:brightness(1.12); }
@media (max-width:600px) {
  .nearby .distrat .distance { transform:translateY(80px); }
}

/* App pass 1 — inbox and reviews use the same calm dark surfaces as places. */
.notification > md-content,
.comments-template > md-content { background:radial-gradient(circle at 88% 0,rgba(122,92,255,.13),transparent 31%),var(--lup-bg); color:var(--lup-text); }
.notification .md-tab-content > div,
.notification md-tabs-content-wrapper,
.notification .scroll-notifications,
.notification md-list,
.comments-template md-list { background:transparent; }
.notification md-tabs-canvas { background:transparent; border-bottom:1px solid rgba(255,255,255,.09); }
.notification md-tab-item { color:#afa8c2; font-size:12px; font-weight:750; }
.notification md-tab-item.md-active { color:#f8f6ff; }
.notification md-ink-bar { height:3px; border-radius:3px 3px 0 0; background:linear-gradient(90deg,#9c7dff,#65acef); }
.notification .lup-notification-list,
.notification md-tabs md-list { padding:10px 13px 28px; }
.notification .lup-notification-list md-list-item,
.notification md-tabs md-list > md-list-item { min-height:68px; margin:7px 0; padding:8px 10px; border:1px solid rgba(255,255,255,.08); border-radius:16px; background:rgba(255,255,255,.045); }
.notification .lup-notification-list md-list-item.lup-notification-unread,
.notification .lup-notification-unread { border-color:rgba(166,143,255,.32); background:linear-gradient(135deg,rgba(122,92,255,.18),rgba(50,132,209,.08)); }
.notification .md-list-item-text h4,
.notification .md-list-item-text p { color:#eeeaf8; }
.notification .md-list-item-text p { font-size:12px; line-height:1.4; }
.notification .lup-item-date { margin:0 0 4px; color:#aaa2c2; font-size:10px; font-weight:700; }
.notification .md-secondary-container .material-icons,
.notification .md-secondary .material-icons { color:#b9a8ff; }
.notification .md-list-item-text a { color:#a9d8ff; }
.comments-template md-list { padding:10px 13px 28px; }
.comments-template md-subheader { margin:4px 0 9px; padding:8px 2px; background:transparent; color:#b9b1ce; font-size:11px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; }
.comments-template md-list-item { min-height:65px; margin:7px 0; padding:8px 10px; border:1px solid rgba(255,255,255,.08); border-radius:16px; background:rgba(255,255,255,.045); }
.comments-template .lup-comment-text { color:#f2effa; font-size:13px; line-height:1.42; }
.comments-template .lup-comment-date { color:#aaa3bb; font-size:11px; }
.comments-template .md-secondary .material-icons { color:#ff9cad; }

/* Inbox — private messages and events are two destinations, not a colourful
 * carousel. The selected destination gets one quiet surface; the old moving
 * gradient ink bar made the switch feel noisy and unrelated to the content. */
.notification .notification-tabs {
  padding: 8px 12px 0;
  background: linear-gradient(180deg, rgba(23, 30, 52, .92), rgba(17, 23, 42, .72));
}
.notification .notification-tabs md-tabs-canvas,
.notification .notification-tabs .md-tab-bar {
  height: 48px;
  border: 0;
  background: transparent;
}
.notification .notification-tabs md-pagination-wrapper {
  display: flex;
  gap: 7px;
  width: 100%;
  transform: none;
}
.notification .notification-tabs md-tab-item {
  position: relative;
  display: flex;
  flex: 1 1 0;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 40px;
  margin: 0;
  padding: 0 10px;
  border: 1px solid transparent;
  border-radius: 12px 12px 5px 5px;
  color: rgba(208, 213, 234, .7);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .025em;
  text-transform: none;
  transition: color 180ms ease, background-color 180ms ease, border-color 180ms ease, transform 180ms ease;
}
.notification .notification-tabs md-tab-item:first-child::before,
.notification .notification-tabs md-tab-item:nth-child(2)::before {
  margin-right: 7px;
  color: currentColor;
  font-family: 'Material Icons';
  font-size: 17px;
  font-weight: 400;
  line-height: 1;
}
.notification .notification-tabs md-tab-item:first-child::before { content: 'forum'; }
.notification .notification-tabs md-tab-item:nth-child(2)::before { content: 'notifications_none'; }
.notification .notification-tabs md-tab-item:hover {
  color: #f1f4ff;
  background: rgba(139, 161, 224, .08);
}
.notification .notification-tabs md-tab-item.md-active {
  border-color: rgba(139, 177, 255, .22);
  background: linear-gradient(145deg, rgba(74, 116, 193, .32), rgba(73, 57, 131, .22));
  box-shadow: inset 0 1px 0 rgba(224, 235, 255, .1);
  color: #f8faff;
}
.notification .notification-tabs .md-ink-bar {
  display: none;
}
.notification .notification-tabs md-tabs-content-wrapper {
  margin-top: 7px;
  border-top: 1px solid rgba(176, 194, 241, .09);
}
.notification .notification-tabs .md-tab-content > div,
.notification .notification-tabs md-content,
.notification .notification-tabs .scroll-notifications {
  background: transparent;
}
.notification .notification-tabs md-list {
  padding: 8px 13px 26px;
}
.notification .notification-tabs md-list > md-list-item {
  position: relative;
  overflow: hidden;
  min-height: 70px;
  margin: 8px 0;
  padding: 9px 11px;
  border: 1px solid rgba(179, 195, 238, .1);
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(255,255,255,.055), rgba(104,124,186,.035));
  box-shadow: none;
}
.notification .notification-tabs md-list > md-list-item::before {
  position: absolute;
  top: 17px;
  bottom: 17px;
  left: 0;
  width: 2px;
  border-radius: 0 2px 2px 0;
  background: rgba(151, 181, 255, .55);
  content: '';
  opacity: 0;
}
.notification .notification-tabs md-list > md-list-item.lup-notification-unread::before {
  opacity: 1;
}
.notification .notification-tabs md-list > md-list-item.lup-notification-unread {
  border-color: rgba(145, 174, 255, .25);
  background: linear-gradient(135deg, rgba(77, 110, 185, .2), rgba(100, 74, 161, .13));
}

/* Private conversation — the legacy room composer inherited a white paper
 * surface. Keep it in the same night-blue material as the location chat. */
.query-page > md-content {
  color: var(--lup-text);
  background:
    radial-gradient(ellipse at 90% 0, rgba(107, 139, 224, .15), transparent 34%),
    linear-gradient(155deg, #171a2a, #0e101a 76%);
}
.query-page .chat-msgs {
  padding: 16px 13px;
  background: linear-gradient(180deg, rgba(17,19,30,.12), rgba(9,11,19,.64));
}
.query-page .lup-msg { margin-bottom: 10px; }
.query-page .chat-msgs .msg .message {
  display: inline-block;
  box-sizing: border-box;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 15px 15px 15px 6px;
  background: rgba(255,255,255,.045);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055);
  color: #f4f5fb;
}
.query-page .lup-own-msg .msg .message {
  border-color: rgba(149, 171, 255, .28);
  border-radius: 15px 15px 6px 15px;
  background: linear-gradient(135deg, rgba(84,112,191,.24), rgba(96,67,164,.16));
}
.query-page .chat-msgs .msg .name,
.query-page .chat-msgs .msg .time { color: #aeb7d0; }
.query-page .chatbottom {
  display: flex;
  align-items: center;
  gap: 7px;
  height: 54px;
  padding: 8px 12px;
  border: 0;
  border-top: 1px solid rgba(172, 191, 241, .14);
  background: rgba(14,16,26,.96);
}
.query-page .chatbottom .chat-input {
  float: none;
  flex: 1 1 auto;
  width: auto;
  padding: 0;
}
.query-page .chatbottom input {
  width: 100%;
  height: 36px;
  padding: 0 9px;
  box-sizing: border-box;
  border: 0;
  border-bottom: 1px solid rgba(255,255,255,.16);
  border-radius: 0;
  outline: 0;
  background: transparent;
  box-shadow: none;
  color: #f5f7ff;
  font-size: 12px;
}
.query-page .chatbottom input::placeholder { color: #93a0bc; opacity: 1; }
.query-page .chatbottom input:focus {
  border-bottom-color: #a9c8ff;
  box-shadow: none;
}
.query-page .chatbottom .chat-button {
  float: none;
  display: grid;
  place-items: center;
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(158, 185, 255, .3);
  border-radius: 11px;
  background: rgba(95, 129, 214, .16);
}
.query-page .chatbottom .chat-button button,
.query-page .chatbottom .chat-button button.sendmessage {
  width: 19px;
  min-width: 19px;
  max-width: 19px;
  height: 19px;
  padding: 0;
  border: 0;
  background-color: #bcd7ff;
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}
.query-page .chatbottom .chat-button:has(button.sendmessage) {
  border-color: rgba(193, 213, 255, .55);
  background: linear-gradient(135deg, #759aeb, #775fc2);
}
.query-page .chatbottom .chat-button:has(button.sendmessage) button { background-color: #fff; }
@media (max-width: 420px) {
  .notification .notification-tabs { padding-right: 9px; padding-left: 9px; }
  .notification .notification-tabs md-tab-item { padding: 0 6px; font-size: 10px; }
  .notification .notification-tabs md-tab-item:first-child::before,
  .notification .notification-tabs md-tab-item:nth-child(2)::before { margin-right: 5px; font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  .notification .notification-tabs md-tab-item { transition: none; }
}

/* Discovery pass — entry and filters use one restrained LinkUUp language. */
.nearby .chatbutton:not(.chatbutton--locked) {
  width:min(86%,330px);
  margin:13px auto 0;
}
.nearby .chatbutton:not(.chatbutton--locked) button {
  float:none;
  width:100%;
  height:50px;
  min-height:50px;
  margin:0;
  border:1px solid rgba(192,180,255,.32);
  border-radius:16px;
  background:linear-gradient(105deg,rgba(129,103,224,.94),rgba(72,133,204,.92));
  box-shadow:0 10px 22px rgba(41,49,116,.26),inset 0 1px 0 rgba(255,255,255,.26);
  color:#fff;
  font-size:13px;
  font-weight:800;
  letter-spacing:.025em;
  text-transform:none;
}
.nearby .chatbutton:not(.chatbutton--locked) button::before {
  content:'forum';
  margin-right:7px;
  font-family:'Material Icons';
  font-size:18px;
  vertical-align:-3px;
}
.nearby .chatbutton:not(.chatbutton--locked) button:active { transform:translateY(1px); box-shadow:0 5px 13px rgba(41,49,116,.25),inset 0 1px 0 rgba(255,255,255,.2); }
.location-categories {
  gap:5px;
  margin:7px 10px 4px;
  padding:5px;
  border:1px solid rgba(214,207,244,.12);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(40,41,61,.95),rgba(25,27,42,.95));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
}
.location-categories button {
  min-height:55px;
  border:1px solid transparent;
  border-radius:11px;
  color:#bab4cc;
}
.location-categories button .material-icons {
  width:27px;
  height:27px;
  border:1px solid currentColor;
  border-radius:9px;
  background:rgba(255,255,255,.035);
  color:inherit;
  font-size:17px;
}
.location-categories button span { margin-top:4px; font-size:7px; font-weight:800; letter-spacing:.01em; }
.location-categories button:hover { background:rgba(255,255,255,.055); }
.location-categories button.active { border-color:rgba(208,198,255,.22); background:rgba(167,145,255,.13); color:#f5f2ff; }
.location-categories button.active::after { right:25%; bottom:3px; left:25%; height:2px; background:#bbaaff; box-shadow:none; }
.location-categories button:nth-child(1) { color:#c5b4ff; }
.location-categories button:nth-child(2) { color:#9fc2e8; }
.location-categories button:nth-child(3) { color:#e9b286; }
.location-categories button:nth-child(4) { color:#e5a0dc; }
.location-categories button:nth-child(5) { color:#9edbe0; }
.location-categories button:nth-child(6) { color:#e0b1bd; }

/* The place card carries the essential context itself, without increasing the
   screen's overall height or moving the action area below it. */
.nearby .room-category-hero {
  grid-template-rows:22px minmax(0,1fr) 18px;
  margin-top:28px;
  padding-top:18px;
  padding-bottom:15px;
}
.nearby .room-category-hero .room-category-orbit { grid-row:1 / 4; }
.nearby .room-hero-name { align-self:center; }
.nearby .room-hero-meta {
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  gap:4px;
  overflow:hidden;
  color:#c7c1d9;
  font-size:10px;
  font-weight:650;
  line-height:1;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.nearby .room-hero-meta .material-icons { color:var(--lup-place-accent); font-size:14px; filter:none; }
@media (max-width:600px) {
  /* Give the actual place profile enough room to read as a destination, while
     keeping the live-presence and two actions directly beneath it. */
  .nearby .roominfo { min-height:490px; }
  .nearby .room-category-hero {
    grid-template-columns:82px minmax(0,1fr);
    grid-template-rows:31px minmax(0,1fr) 24px;
    height:188px;
    margin-top:31px;
    padding:24px 20px 20px;
    border-radius:22px;
  }
  .nearby .room-category-hero .room-category-orbit { width:62px; height:62px; border-color:color-mix(in srgb,var(--lup-place-accent) 68%,rgba(255,255,255,.25)); background:color-mix(in srgb,var(--lup-place-accent) 19%,rgba(255,255,255,.03)); }
  .nearby .room-category-hero .room-category-orbit .material-icons { color:var(--lup-place-accent); font-size:33px; }
  .nearby .room-category-hero .room-category-name { align-self:center; width:max-content; max-width:100%; padding:5px 8px; overflow:hidden; border:1px solid color-mix(in srgb,var(--lup-place-accent) 48%,transparent); border-radius:999px; background:color-mix(in srgb,var(--lup-place-accent) 13%,transparent); color:color-mix(in srgb,var(--lup-place-accent) 78%,#fff); font-size:8px; font-weight:850; letter-spacing:.12em; text-overflow:ellipsis; }
  .nearby .room-hero-name { align-self:center; max-width:100%; margin-top:3px; overflow:hidden; font-size:clamp(22px,6.4vw,29px); font-weight:780; line-height:1.04; letter-spacing:-.03em; text-wrap:balance; }
  .nearby .room-hero-meta { padding-top:5px; color:#d3cde2; font-size:11px; }
  .nearby .room-user-preview { margin-top:7px; }
}

/* Discovery refinement: venue symbols must guide, never compete with the
   place itself.  This intentionally replaces the earlier playful badge look
   with one restrained, editorial icon system. */
.location-categories {
  gap:2px;
  padding:3px;
  border-color:rgba(255,255,255,.08);
  border-radius:12px;
  background:rgba(21,23,35,.78);
}
.location-categories button {
  min-height:48px;
  border-radius:8px;
  color:#aaa8b6;
}
.location-categories button .material-icons {
  width:20px;
  height:20px;
  color:#bdbacb;
  font-size:19px;
  line-height:20px;
  opacity:.82;
}
.location-categories button span {
  margin-top:3px;
  color:#aaa8b6;
  font-size:7px;
  font-weight:720;
  letter-spacing:0;
}
.location-categories button.active {
  border-color:rgba(194,185,255,.20);
  background:rgba(151,133,232,.14);
  color:#f6f4ff;
}
.location-categories button.active .material-icons,
.location-categories button.active span { color:#ded8ff; opacity:1; }
.location-categories button.active::after {
  right:35%;
  bottom:2px;
  left:35%;
  background:#c1b5ff;
  box-shadow:none;
}

.nearby .room-category-hero {
  border-color:rgba(255,255,255,.10);
  background:linear-gradient(115deg,rgba(40,42,59,.96),rgba(23,25,37,.98));
  box-shadow:0 13px 28px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.06);
}
.nearby .room-category-hero::before {
  width:2px;
  background:var(--lup-place-accent);
  box-shadow:none;
}
.nearby .room-category-hero .room-category-orbit {
  border-color:color-mix(in srgb,var(--lup-place-accent) 40%,rgba(255,255,255,.12));
  border-radius:16px;
  background:color-mix(in srgb,var(--lup-place-accent) 10%,rgba(255,255,255,.025));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09);
}
.nearby .room-category-orbit::before,
.nearby .room-category-orbit::after { display:none; }
.nearby .room-category-hero .room-category-orbit .material-icons {
  color:var(--lup-place-accent);
  filter:none;
  text-shadow:none;
}
.nearby .room-category-hero .room-category-name {
  border:0;
  border-radius:0;
  background:transparent;
  color:#aaa7b8;
  font-weight:760;
  letter-spacing:.10em;
  text-shadow:none;
}

.nearby .distrat { gap:34px; }
.nearby .distrat .location-cuddles {
  border-color:rgba(239,178,205,.32);
  border-radius:14px;
  background:rgba(196,93,139,.12);
  color:#f1bad0;
}
.nearby .distrat .location-cuddles > .material-icons { font-size:27px; }
.nearby .distrat .location-cuddles strong {
  border-color:#252737;
  background:#e6b4c8;
  color:#382b38;
}
.nearby .distrat .distance a > .material-icons {
  border-color:rgba(158,211,233,.32);
  background:rgba(74,143,178,.10);
  color:#acdced;
  font-size:27px;
}
.nearby .distrat .distance a > span { color:#afcbd7; font-weight:700; }
@media (max-width:600px) {
  .location-categories button { min-height:46px; }
  .nearby .distrat { gap:46px; }
  .nearby .room-category-hero .room-category-orbit { border-radius:15px; }
}

/* Keep the symbols unmistakable at a glance.  Contrast and scale carry the
   meaning; decoration stays deliberately restrained. */
.location-categories { gap:4px; padding:5px; }
.location-categories button { min-height:58px; }
.location-categories button .material-icons {
  width:29px;
  height:29px;
  font-size:27px;
  line-height:29px;
  opacity:1;
}
.location-categories button span {
  margin-top:5px;
  color:#cbc8d7;
  font-size:8px;
  font-weight:800;
}
.location-categories button:nth-child(1) .material-icons { color:#c5b4ff; }
.location-categories button:nth-child(2) .material-icons { color:#a8c7ed; }
.location-categories button:nth-child(3) .material-icons { color:#efbb82; }
.location-categories button:nth-child(4) .material-icons { color:#ef9ee8; }
.location-categories button:nth-child(5) .material-icons { color:#91d9e4; }
.location-categories button:nth-child(6) .material-icons { color:#e9afc0; }
.location-categories button.active .material-icons { filter:drop-shadow(0 0 7px currentColor); }

.nearby .room-category-hero { grid-template-columns:94px minmax(0,1fr); }
.nearby .room-category-hero .room-category-orbit {
  width:74px;
  height:74px;
  border-radius:20px;
  background:color-mix(in srgb,var(--lup-place-accent) 18%,rgba(255,255,255,.035));
}
.nearby .room-category-hero .room-category-orbit .material-icons { font-size:41px; }
.nearby .room-category-hero .room-category-name { color:#c3bfce; font-size:9px; }
.nearby .distrat .location-cuddles,
.nearby .distrat .distance { width:60px; min-width:60px; height:60px; }
.nearby .distrat .location-cuddles {
  display:grid;
  place-items:center;
  box-sizing:border-box;
}
.nearby .distrat .location-cuddles > .material-icons {
  display:block;
  width:auto;
  height:auto;
  margin:0;
  padding:0;
  font-size:32px;
  line-height:1;
}
.nearby .distrat .distance a > .material-icons { width:60px; height:60px; font-size:32px; }
@media (max-width:600px) {
  .location-categories button { min-height:54px; }
  .location-categories button .material-icons { width:26px; height:26px; font-size:24px; line-height:26px; }
  .location-categories button span { font-size:7px; }
  .nearby .room-category-hero { grid-template-columns:88px minmax(0,1fr); }
  .nearby .room-category-hero .room-category-orbit { width:68px; height:68px; border-radius:19px; }
  .nearby .room-category-hero .room-category-orbit .material-icons { font-size:38px; }
}

/* The distance is data, not decoration: retain it below the route mark on
   every breakpoint, and offset only this action a touch to the right. */
.nearby .distrat .distance {
  transform:translateX(8px);
}
.nearby .distrat .distance a > span {
  position:absolute;
  z-index:2;
  right:-11px;
  bottom:-3px;
  display:block;
  visibility:visible;
  min-width:27px;
  max-width:62px;
  margin:0;
  padding:4px 6px;
  overflow:hidden;
  border:1px solid rgba(170,224,242,.42);
  border-radius:999px;
  background:#263b52;
  box-shadow:0 4px 9px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.12);
  color:#d6f3ff;
  font-size:8px;
  font-weight:850;
  line-height:1;
  text-align:center;
  text-overflow:ellipsis;
  white-space:nowrap;
}
@media (max-width:600px) {
  .nearby .distrat { gap:46px; }
  .nearby .distrat .distance { transform:translate(8px,78px); }
}

/* Discovery depth: a subtle blue-violet mesh keeps the dark surface alive
   without competing with the place cards or reducing text contrast. */
.nearby md-content.greybg {
  background:
    radial-gradient(ellipse 80% 38% at 8% -10%,rgba(85,116,205,.16),transparent 70%),
    radial-gradient(ellipse 62% 34% at 94% 24%,rgba(143,91,214,.13),transparent 72%),
    radial-gradient(circle at 22% 74%,rgba(63,144,191,.08),transparent 35%),
    linear-gradient(155deg,#171a29 0%,#1b1d2d 48%,#151724 100%);
}
.nearby md-content.greybg::before {
  content:'';
  position:fixed;
  z-index:0;
  inset:0;
  pointer-events:none;
  opacity:.20;
  background-image:radial-gradient(rgba(204,214,255,.34) .55px,transparent .8px);
  background-size:17px 17px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.75),transparent 82%);
}
.nearby md-content.greybg > * { position:relative; z-index:1; }

/* City is the entry into the wider world: make its small building mark read
   like a beacon above the card, not just another neutral category glyph. */
.nearby .room-category-hero.category-city .room-category-orbit {
  position:relative;
  z-index:2;
  border-color:rgba(207,228,255,.82);
  background:linear-gradient(145deg,rgba(128,183,245,.30),rgba(74,101,184,.20));
  box-shadow:0 0 0 3px rgba(135,192,255,.08),0 0 18px rgba(114,186,255,.52),0 0 38px rgba(117,103,244,.28),inset 0 1px 0 rgba(255,255,255,.36);
  transform:translate(-3px,-9px);
}
.nearby .room-category-hero.category-city .room-category-orbit .material-icons {
  color:#d8efff;
  text-shadow:0 0 8px rgba(205,240,255,.85),0 0 17px rgba(114,181,255,.68);
}
.nearby .room-category-hero.category-city .room-category-orbit::after {
  content:'';
  position:absolute;
  z-index:-1;
  inset:-13px;
  border:1px solid rgba(139,193,255,.24);
  border-radius:25px;
  box-shadow:0 0 26px rgba(111,171,255,.22);
}

/* More breathing room between the destination card and live presence. */
.nearby .room-user-preview { top:53px; }
@media (max-width:600px) {
  .nearby .room-user-preview { top:51px; }
  .nearby .room-category-hero.category-city .room-category-orbit { transform:translate(-2px,-7px); }
}

/* Every place gets the same readable landmark treatment; its category colour
   carries the personality, while the geometry stays coherent across the app. */
.nearby .room-category-hero .room-category-orbit {
  position:relative;
  z-index:2;
  border-color:color-mix(in srgb,var(--lup-place-accent) 68%,#eef4ff);
  background:linear-gradient(145deg,color-mix(in srgb,var(--lup-place-accent) 28%,rgba(255,255,255,.14)),rgba(26,31,51,.48));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--lup-place-accent) 11%,transparent),0 0 18px var(--lup-place-glow),0 10px 20px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.30);
  transform:translate(-3px,-7px);
}
.nearby .room-category-hero .room-category-orbit .material-icons {
  color:color-mix(in srgb,var(--lup-place-accent) 42%,#fff);
  text-shadow:0 0 8px color-mix(in srgb,var(--lup-place-accent) 66%,#fff),0 0 17px var(--lup-place-glow);
}
.nearby .room-category-hero .room-category-orbit::after {
  content:'';
  position:absolute;
  z-index:-1;
  inset:-11px;
  display:block;
  border:1px solid color-mix(in srgb,var(--lup-place-accent) 25%,transparent);
  border-radius:24px;
  box-shadow:0 0 24px var(--lup-place-glow);
}
/* A venue name should be the confident headline, not a heavy block. */
.nearby .room-hero-name {
  font-weight:680;
  letter-spacing:-.025em;
}
@media (max-width:600px) {
  .nearby .room-category-hero .room-category-orbit { transform:translate(-2px,-6px); }
  .nearby .room-hero-name { font-weight:670; }
}

/* One material language for every category mark. Colour may vary, but none of
   the symbols should look washed out or like it belongs to another component. */
.nearby .room-category-hero .room-category-orbit,
.nearby .room-category-hero.category-city .room-category-orbit {
  border:1px solid color-mix(in srgb,var(--lup-place-accent) 58%,#eef4ff);
  background:linear-gradient(145deg,color-mix(in srgb,var(--lup-place-accent) 38%,#526071),color-mix(in srgb,var(--lup-place-accent) 17%,#202534));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--lup-place-accent) 10%,transparent),0 0 19px var(--lup-place-glow),0 10px 20px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.32),inset 0 -8px 15px rgba(10,13,25,.20);
  opacity:1;
}
.nearby .room-category-hero .room-category-orbit .material-icons,
.nearby .room-category-hero.category-city .room-category-orbit .material-icons {
  color:#f5f8ff;
  opacity:1;
  text-shadow:0 0 7px color-mix(in srgb,var(--lup-place-accent) 48%,#fff),0 0 15px var(--lup-place-glow);
}
.nearby .room-category-hero .room-category-orbit::after,
.nearby .room-category-hero.category-city .room-category-orbit::after {
  border-color:color-mix(in srgb,var(--lup-place-accent) 30%,rgba(255,255,255,.18));
  box-shadow:0 0 23px var(--lup-place-glow);
  opacity:1;
}

/* Location detail: replace the shared Braunschweig fallback image with a
   category-aware atmosphere. A bar should look like a bar, not like a city. */
.location-hero { --location-accent:#9e8bff; --location-glow:rgba(158,139,255,.30); background:radial-gradient(circle at 78% 20%,var(--location-glow),transparent 38%),linear-gradient(145deg,#2b2c45,#171826 72%); }
.location-hero-art { position:absolute; inset:0; display:grid; place-items:center; overflow:hidden; }
.location-hero-art::before { content:''; position:absolute; width:250px; height:250px; border:1px solid color-mix(in srgb,var(--location-accent) 44%,transparent); border-radius:42%; box-shadow:0 0 0 26px color-mix(in srgb,var(--location-accent) 6%,transparent),0 0 48px var(--location-glow); transform:translate(30%,-8%) rotate(-13deg); }
.location-hero-art .material-icons { position:relative; color:color-mix(in srgb,var(--location-accent) 46%,#fff); font-size:136px; opacity:.30; text-shadow:0 0 28px var(--location-glow); transform:translate(30px,-14px); }
.location-hero.location-category-city { --location-accent:#8fc8ff; --location-glow:rgba(101,180,255,.32); }.location-hero.location-category-bar,.location-hero.location-category-food { --location-accent:#f2aa72; --location-glow:rgba(238,132,83,.30); }.location-hero.location-category-cafe { --location-accent:#e2b87f; --location-glow:rgba(207,151,95,.28); }.location-hero.location-category-club { --location-accent:#ec8de3; --location-glow:rgba(213,83,211,.31); }.location-hero.location-category-culture { --location-accent:#8cc7ee; --location-glow:rgba(90,172,229,.28); }.location-hero.location-category-sport,.location-hero.location-category-outdoors { --location-accent:#83d2a2; --location-glow:rgba(75,192,135,.28); }.location-hero.location-category-education { --location-accent:#88d6e6; --location-glow:rgba(85,189,209,.28); }.location-hero.location-category-health { --location-accent:#f49ab2; --location-glow:rgba(228,103,144,.28); }

/* Long place names belong to the card, not behind its edge. */
.nearby .room-hero-name {
  display:-webkit-box;
  max-width:100%;
  max-height:2.12em;
  overflow:hidden;
  font-size:clamp(19px,5.5vw,27px);
  font-weight:670;
  line-height:1.06;
  letter-spacing:-.035em;
  overflow-wrap:anywhere;
  text-overflow:clip;
  white-space:normal;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
@media (max-width:600px) {
  .nearby .room-hero-name {
    font-size:clamp(18px,5.8vw,24px);
    line-height:1.08;
  }
}

/* A quieter display treatment makes long venue names feel intentional rather
   than merely shrunk to fit. */
.nearby .room-hero-name {
  align-self:center;
  padding-right:5px;
  color:#fbfaff;
  font-family:"Segoe UI",Inter,Roboto,Arial,sans-serif;
  font-weight:640;
  text-shadow:0 2px 12px rgba(0,0,0,.48),0 0 18px color-mix(in srgb,var(--lup-place-accent) 18%,transparent);
  text-wrap:balance;
}
.nearby .room-category-hero .room-category-name {
  position:relative;
  padding-left:11px;
}
.nearby .room-category-hero .room-category-name::before {
  content:'';
  position:absolute;
  top:50%;
  left:0;
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--lup-place-accent);
  box-shadow:0 0 8px var(--lup-place-glow);
  transform:translateY(-50%);
}

/* Name tiers are chosen by the actual venue-name length in the controller. */
.nearby .room-hero-name {
  max-height:2.2em;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:clamp(20px,5.1vw,25px);
  font-weight:560;
  line-height:1.1;
  letter-spacing:-.028em;
  overflow-wrap:break-word;
  text-wrap:pretty;
}
.nearby .room-hero-name.room-hero-name--compact {
  font-size:clamp(18px,4.7vw,22px);
  font-weight:555;
  letter-spacing:-.022em;
}
.nearby .room-hero-name.room-hero-name--long {
  font-size:clamp(16px,4.25vw,20px);
  font-weight:545;
  line-height:1.13;
  letter-spacing:-.012em;
}
.nearby .room-hero-name.room-hero-name--longword {
  font-size:clamp(16px,4.05vw,19px);
  font-weight:505;
  letter-spacing:-.035em;
  line-height:1.12;
}
@media (max-width:600px) {
  .nearby .room-hero-name { font-size:clamp(19px,5.1vw,23px); }
  .nearby .room-hero-name.room-hero-name--compact { font-size:clamp(17px,4.7vw,21px); }
  .nearby .room-hero-name.room-hero-name--long { font-size:clamp(16px,4.2vw,19px); }
  .nearby .room-hero-name.room-hero-name--longword { font-size:clamp(15px,4vw,18px); }
}

/* Final type polish for venue names: light, precise, and readable. */
.nearby .room-hero-name {
  color:#f4f2fa;
  font-weight:520;
  letter-spacing:-.018em;
  text-shadow:0 2px 8px rgba(0,0,0,.38);
}
.nearby .room-hero-name.room-hero-name--compact { font-weight:510; }
.nearby .room-hero-name.room-hero-name--long { font-weight:500; letter-spacing:-.008em; }

/* Never detach the final letter of a venue name (for example the “g” in
   Braunschweig). Titles may wrap between words, but not inside a word. */
.nearby .room-hero-name {
  overflow-wrap:normal;
  word-break:keep-all;
  hyphens:none;
}

/* Older Bar/Club overrides were still opaque and heavier than the shared
   category language. Keep their warm/pink accents, but give them the same
   transparent surface, rim and depth as every other place type. */
.nearby .room-category-hero.category-bar .room-category-orbit,
.nearby .room-category-hero.category-pub .room-category-orbit,
.nearby .room-category-hero.category-cafe .room-category-orbit,
.nearby .room-category-hero.category-food .room-category-orbit,
.nearby .room-category-hero.category-club .room-category-orbit {
  border-color:color-mix(in srgb,var(--lup-place-accent) 58%,#eef4ff);
  background:linear-gradient(145deg,color-mix(in srgb,var(--lup-place-accent) 25%,rgba(255,255,255,.12)),rgba(28,32,47,.42));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--lup-place-accent) 10%,transparent),0 0 19px var(--lup-place-glow),0 10px 20px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.28);
}

/* Final override: category-specific legacy rules may only supply the accent
   variable. Geometry, transparency and depth are universal. */
.nearby .room-category-hero[class*="category-"] .room-category-orbit {
  border:1px solid color-mix(in srgb,var(--lup-place-accent) 58%,#eef4ff);
  border-radius:19px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--lup-place-accent) 25%,rgba(255,255,255,.12)),rgba(28,32,47,.42));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--lup-place-accent) 10%,transparent),0 0 19px var(--lup-place-glow),0 10px 20px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.28);
  opacity:1;
}
.nearby .room-category-hero[class*="category-"] .room-category-orbit .material-icons {
  color:#f5f8ff;
  opacity:1;
  filter:none;
  text-shadow:0 0 7px color-mix(in srgb,var(--lup-place-accent) 48%,#fff),0 0 15px var(--lup-place-glow);
}

/* The primary action shares the discovery cards' luminous glass material. */
.nearby .chatbutton:not(.chatbutton--locked) button {
  border-color:rgba(197,189,255,.48);
  background:linear-gradient(120deg,rgba(133,106,225,.50),rgba(69,147,211,.34));
  box-shadow:0 0 0 1px rgba(185,174,255,.08),0 0 20px rgba(127,108,238,.20),0 11px 23px rgba(10,15,42,.26),inset 0 1px 0 rgba(255,255,255,.33),inset 0 -1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(13px) saturate(125%);
  -webkit-backdrop-filter:blur(13px) saturate(125%);
  color:#fbfaff;
  text-shadow:0 1px 5px rgba(22,20,63,.38);
}
.nearby .chatbutton:not(.chatbutton--locked) button:hover { filter:brightness(1.10); }
.nearby .chatbutton:not(.chatbutton--locked) button:active { filter:brightness(.97); }

/* Place-card header: category atmosphere fills the former empty name strip
   while the actual venue name remains the unmistakable focal point. */
.nearby .room-category-hero {
  overflow:visible;
  background:linear-gradient(118deg,color-mix(in srgb,var(--lup-place-accent) 18%,#33394d),#1b1e2c 68%);
}
.nearby .room-category-hero::after {
  display:block;
  z-index:0;
  inset:0;
  border-radius:inherit;
  background:radial-gradient(circle at 78% 42%,color-mix(in srgb,var(--lup-place-accent) 18%,transparent),transparent 42%);
  opacity:1;
}
.nearby .room-category-hero::before {
  z-index:1;
  top:auto;
  right:18px;
  bottom:0;
  left:18px;
  width:auto;
  height:2px;
  border-radius:2px 2px 0 0;
  background:linear-gradient(90deg,transparent,var(--lup-place-accent) 20%,var(--lup-place-accent) 80%,transparent);
  box-shadow:0 0 13px var(--lup-place-glow);
}
.nearby .room-category-hero .room-category-orbit { z-index:2; }
.nearby .room-category-hero .room-category-name,
.nearby .room-category-hero .room-hero-name,
.nearby .room-category-hero .room-hero-meta { z-index:2; }
.nearby .room-hero-meta { color:#d8d7e3; font-size:10px; font-weight:620; letter-spacing:.01em; }
.nearby .room-hero-meta .material-icons { margin-right:3px; color:var(--lup-place-accent); font-size:13px; }

/* City is a useful orientation marker, not a faint line of secondary text. */
/* The wording follows one hierarchy: category → place name → orientation. */
.nearby .room-category-name { color:color-mix(in srgb,var(--lup-place-accent) 78%,#fff); }
.nearby .room-hero-name { font-weight:790; }
.nearby .room-hero-meta { width:100%; max-width:100%; min-height:28px; padding:6px 0 6px 10px; border:0; border-left:2px solid var(--lup-place-accent); border-radius:0; background:linear-gradient(90deg,color-mix(in srgb,var(--lup-place-accent) 20%,transparent),transparent 82%); box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 0 17px var(--lup-place-glow); color:#f1eff8; font-weight:760; }
.nearby .room-hero-meta .material-icons { margin-right:2px; color:var(--lup-place-accent); font-size:15px; filter:drop-shadow(0 0 5px var(--lup-place-glow)); }
.nearby .room-category-hero { border:1px solid color-mix(in srgb,var(--lup-place-accent) 30%,rgba(255,255,255,.13)); background:radial-gradient(circle at 85% 45%,color-mix(in srgb,var(--lup-place-accent) 28%,transparent),transparent 52%),linear-gradient(118deg,rgba(42,44,74,.98),rgba(20,23,42,.98)); box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 17px 34px rgba(0,0,0,.27),0 0 25px var(--lup-place-glow); }

/* Keep the iPhone-friendly city field and refine only its typography. */
.nearby .room-hero-meta { width:100%; min-height:30px; margin-right:0; overflow:visible; white-space:normal; text-overflow:clip; font-size:10px; line-height:1.25; letter-spacing:.005em; }
@media (max-width:600px) { .nearby .room-category-hero { grid-template-rows:31px minmax(0,1fr) 35px; height:199px; }.nearby .room-hero-meta { min-height:32px; padding-top:5px; padding-bottom:5px; font-size:10px; } }

/* The name stays complete; the city is marked by light, not a rigid frame. */
.nearby .room-hero-name { max-width:100%; font-size:clamp(21px,5.8vw,29px); letter-spacing:-.048em; }
.nearby .room-category-hero { border:0; box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 17px 34px rgba(0,0,0,.23),0 0 23px var(--lup-place-glow); }
.nearby .room-hero-meta { display:flex; align-items:center; gap:6px; padding:4px 0; border:0; background:transparent; box-shadow:none; color:#ddd9eb; font-weight:690; }
.nearby .room-hero-meta::before { content:''; flex:0 0 6px; width:6px; height:6px; border-radius:50%; background:var(--lup-place-accent); box-shadow:0 0 8px var(--lup-place-accent),0 0 17px var(--lup-place-glow); }
.nearby .room-hero-meta .material-icons { display:none; }

/* Phone composition: keep the place identity untouched, but compress the
 * surrounding live, QR and route controls so chat entry stays on one screen. */
@media (max-width:900px) {
  .nearby .roominfo { min-height:432px; }
  .nearby .room-user-preview { top:24px; min-height:46px; margin-top:3px; padding-top:5px; padding-bottom:5px; }
  .nearby .room-user-preview .lup-avatar,.nearby .room-user-preview .lup-avatar img { width:34px; height:34px; }
  .nearby .room-presence-count { padding:4px 7px; font-size:9px; }
  .nearby .roominfo .distrat { display:flex; align-items:center; height:64px; bottom:16px; gap:42px; }
  .nearby .roominfo .distrat .location-cuddles,.nearby .roominfo .distrat .distance { position:relative; top:auto; right:auto; bottom:auto; left:auto; width:60px; min-width:60px; height:60px; margin:0; transform:none; }
  .nearby .roominfo .distrat .distance a { display:flex; align-items:center; justify-content:center; width:60px; height:60px; }
  .nearby .chatbutton { margin-top:2px; }.nearby .chatbutton button { height:48px; min-height:48px; border-radius:16px; }

  /* The search stays below the fixed avatar bar while the locations scroll. */
  .nearby .search-input-wrap { position:fixed; z-index:100; top:0; right:0; left:0; display:block; width:100%; min-height:58px; margin:0; padding:9px 14px 7px; box-sizing:border-box; background:linear-gradient(180deg,#202139 82%,rgba(32,33,57,.96)); }
  .nearby .search-input-wrap .search-input { display:block; width:100%; min-height:35px; padding:0 12px 0 34px; box-sizing:border-box; border:1px solid rgba(198,207,255,.13); border-radius:10px; background:rgba(255,255,255,.055); color:#eeeefa; }
  .nearby .location-categories { margin-top:3px; }
}

/* Chat entry is the tactile continuation of the place card, rather than an
   unrelated blue control.  Its small accent rail mirrors the header above. */
.nearby .chatbutton:not(.chatbutton--locked) button {
  position:relative;
  overflow:hidden;
  border-color:color-mix(in srgb,var(--lup-place-accent) 28%,transparent);
  background:linear-gradient(118deg,color-mix(in srgb,var(--lup-place-accent) 56%,#29314c),#25253a 82%);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--lup-place-accent) 14%,transparent),0 0 20px var(--lup-place-glow),0 11px 23px rgba(10,15,42,.29),inset 0 1px 0 rgba(255,255,255,.30),inset 0 -1px 0 rgba(255,255,255,.07);
}
.nearby .chatbutton:not(.chatbutton--locked) button::after {
  content:'';
  position:absolute;
  right:16%; bottom:0; left:16%; height:2px;
  border-radius:2px 2px 0 0;
  background:linear-gradient(90deg,transparent,var(--lup-place-accent),transparent);
  box-shadow:0 0 11px var(--lup-place-glow);
  pointer-events:none;
}
.nearby .chatbutton:not(.chatbutton--locked) button:hover { filter:brightness(1.08) saturate(1.08); }

/* Discovery circuit: the chosen category sends a quiet visual signal into the
   active place card.  It is decoration only; filters keep their normal logic. */
.nearby .location-categories {
  --lup-circuit:#a99aff;
  --lup-circuit-glow:rgba(169,154,255,.35);
  position:relative;
  isolation:isolate;
  overflow:visible;
}

/* Available chat: make the next action unmistakably inviting.  The locked
 * variant stays quiet; only a room the user can actually enter receives this
 * warm, live-entry treatment. */
.nearby .chatbutton:not(.chatbutton--locked) {
  width:min(88%,342px);
  margin:14px auto 0;
}
.nearby .chatbutton:not(.chatbutton--locked) button {
  min-height:54px;
  height:54px;
  border-color:color-mix(in srgb,var(--lup-place-accent) 54%,rgba(235,241,255,.55));
  border-radius:17px;
  background:linear-gradient(108deg,
    color-mix(in srgb,var(--lup-place-accent) 78%,#8d71e8),
    color-mix(in srgb,var(--lup-place-accent) 48%,#2d72bf));
  box-shadow:0 0 0 1px rgba(255,255,255,.12),0 12px 26px color-mix(in srgb,var(--lup-place-glow) 66%,transparent),0 14px 24px rgba(9,14,39,.30),inset 0 1px 0 rgba(255,255,255,.40),inset 0 -1px 0 rgba(20,28,75,.24);
  color:#fff;
  font-size:13px;
  font-weight:900;
  letter-spacing:.04em;
  text-shadow:0 1px 3px rgba(16,23,71,.36);
}
.nearby .chatbutton:not(.chatbutton--locked) button::before {
  content:'login';
  display:inline-grid;
  place-items:center;
  width:29px;
  height:29px;
  margin:0 2px 0 0;
  border:1px solid rgba(255,255,255,.34);
  border-radius:10px 10px 10px 4px;
  background:rgba(12,24,78,.19);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.20),0 0 13px rgba(255,255,255,.15);
  color:#fff;
  font-family:'Material Icons';
  font-size:19px;
  line-height:1;
}
.nearby .chatbutton:not(.chatbutton--locked) button::after {
  right:12px;
  bottom:auto;
  left:auto;
  width:7px;
  height:7px;
  border:1px solid rgba(255,255,255,.68);
  border-radius:50%;
  background:#aaf5d1;
  box-shadow:0 0 0 4px rgba(170,245,209,.12),0 0 13px rgba(170,245,209,.86);
}
.nearby .chatbutton:not(.chatbutton--locked) button:hover { filter:brightness(1.08) saturate(1.08); transform:translateY(-1px); }
.nearby .chatbutton:not(.chatbutton--locked) button:active { transform:translateY(1px); }
.nearby .location-categories:has(button:nth-child(2).active) { --lup-circuit:#8fc8ff; --lup-circuit-glow:rgba(109,187,255,.34); }
.nearby .location-categories:has(button:nth-child(3).active) { --lup-circuit:#efb17c; --lup-circuit-glow:rgba(238,145,89,.34); }
.nearby .location-categories:has(button:nth-child(4).active) { --lup-circuit:#ea91e3; --lup-circuit-glow:rgba(222,98,214,.36); }
.nearby .location-categories:has(button:nth-child(5).active) { --lup-circuit:#90dae7; --lup-circuit-glow:rgba(89,194,211,.34); }
.nearby .location-categories:has(button:nth-child(6).active) { --lup-circuit:#9bcce9; --lup-circuit-glow:rgba(102,173,221,.32); }
.nearby .location-categories button.active {
  position:relative;
  z-index:2;
  border-color:color-mix(in srgb,var(--lup-circuit) 52%,transparent);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--lup-circuit) 12%,transparent),0 0 15px var(--lup-circuit-glow),inset 0 1px 0 rgba(255,255,255,.18);
}
.nearby .location-categories button.active::after {
  content:'';
  position:absolute;
  z-index:-1;
  top:100%; left:50%; width:2px; height:38px;
  background:linear-gradient(var(--lup-circuit),color-mix(in srgb,var(--lup-circuit) 18%,transparent));
  box-shadow:0 0 10px var(--lup-circuit-glow);
  pointer-events:none;
}
.nearby md-content.greybg{ min-width:0; max-width:100%; }
.nearby .location-categories:has(button:nth-child(1).active) { --lup-circuit-x:8.333%; }
.nearby .location-categories:has(button:nth-child(2).active) { --lup-circuit-x:25%; }
.nearby .location-categories:has(button:nth-child(3).active) { --lup-circuit-x:41.667%; }
.nearby .location-categories:has(button:nth-child(4).active) { --lup-circuit-x:58.333%; }
.nearby .location-categories:has(button:nth-child(5).active) { --lup-circuit-x:75%; }
.nearby .location-categories:has(button:nth-child(6).active) { --lup-circuit-x:91.667%; }

/* Keep the category response, remove the visible circuit. The discovery strip
   stays calm while the matching seal still gives the user orientation. */
.nearby .location-categories button::after { display:block; opacity:0; transform:scaleX(0); transform-origin:center; transition:transform 190ms cubic-bezier(.2,.85,.25,1),opacity 120ms ease-out; }
.nearby .location-categories button.is-current-category::after { opacity:1; transform:scaleX(1); }
@media (prefers-reduced-motion:reduce) { .nearby .location-categories button::after { transition:none; } }

/* Live presence is a compact guest rail: five faces stay recognisable, then
   a numeric stack takes over. This scales from an empty venue to 99+ guests. */
.nearby .room-user-preview {
  top:52px;
  min-height:62px;
  margin:8px 18px 0 23px;
  padding:6px 8px 9px;
  align-items:flex-start;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.nearby .room-user-preview::before {
  top:auto;
  right:8px;
  bottom:5px;
  left:8px;
  width:auto;
  height:1px;
  margin:0;
  border-radius:1px;
  background:linear-gradient(90deg,transparent,rgba(178,188,220,.24) 15%,rgba(139,166,218,.34) 68%,transparent);
  box-shadow:none;
}
.nearby .room-user-preview .lup-avatar {
  box-sizing:border-box;
  width:46px;
  height:46px;
  margin-top:1px;
  margin-left:-15px;
  padding:2px;
  border:2px solid #202838;
  border-radius:50%;
  background:#202838;
  box-shadow:0 5px 12px rgba(0,0,0,.26);
}
.nearby .room-user-preview .lup-avatar:first-child { margin-left:0; }
.nearby .room-user-preview .lup-avatar:nth-child(2) { transform:translateY(4px); }
.nearby .room-user-preview .lup-avatar:nth-child(3) { transform:translateY(1px); }
.nearby .room-user-preview .lup-avatar:nth-child(4) { transform:translateY(5px); }
.nearby .room-user-preview .lup-avatar:nth-child(5) { transform:translateY(2px); }
.nearby .room-user-preview .more-users {
  flex:0 0 40px;
  width:40px;
  height:40px;
  margin-top:4px;
  margin-left:-12px;
  border:2px solid #202838;
  border-radius:50%;
  background:linear-gradient(145deg,#477779,#3d5276);
  box-shadow:0 5px 12px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.16);
  color:#e3f8f0;
}
.nearby .room-user-preview .more-users b { line-height:36px; font-size:10px; }
.nearby .room-presence-count {
  display:flex;
  align-items:center;
  gap:3px;
  margin-top:8px;
  margin-left:auto;
  padding:5px 7px;
  border:1px solid rgba(174,188,220,.15);
  border-radius:10px;
  background:rgba(49,54,72,.34);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  color:#d9dfed;
  font-size:9px;
  font-weight:800;
  white-space:nowrap;
}
.nearby .room-presence-count .material-icons { width:17px; height:17px; margin:0; font-size:13px; }
@media (max-width:360px) {
  .nearby .room-user-preview { margin-left:13px; margin-right:10px; }
  .nearby .room-user-preview .lup-avatar { width:42px; height:42px; margin-left:-16px; }
  .nearby .room-presence-count { padding:4px 5px; font-size:8px; }
}

/* Private messages animate as one compact bubble: avatar, header and text
   stay together, while the outer repeat row keeps its full-width alignment. */
.query-page .chat-msgs .lup-msg > .head {
  display:flex;
  width:100%;
}
.query-page .chat-msgs .query-message-card {
  width:fit-content;
  max-width:min(calc(100% - 16px), 560px);
  flex:0 1 auto;
}
.query-page .chat-msgs .query-message-content {
  flex:0 1 auto;
  max-width:calc(100% - 54px);
}
.query-page .chat-msgs .lup-own-msg > .head {
  justify-content:flex-end;
}
@media (max-width:600px) {
  .nearby .location-categories button.active::after { height:30px; }
}

/* Category seals: one compact, technical icon family instead of six unrelated
   pictograms. The hue identifies the destination; the shape stays consistent. */
.nearby .location-categories button:nth-child(1) { --lup-category-ink:#c2b4ff; }
.nearby .location-categories button:nth-child(2) { --lup-category-ink:#a9d2ff; }
.nearby .location-categories button:nth-child(3) { --lup-category-ink:#f1bd8b; }
.nearby .location-categories button:nth-child(4) { --lup-category-ink:#f0a4e9; }
.nearby .location-categories button:nth-child(5) { --lup-category-ink:#9ce2e8; }
.nearby .location-categories button:nth-child(6) { --lup-category-ink:#b5d1ed; }
.nearby .location-categories button {
  min-height:56px;
  border-radius:10px;
  color:color-mix(in srgb,var(--lup-category-ink) 60%,#a3a3b2);
  background:linear-gradient(160deg,rgba(255,255,255,.028),rgba(255,255,255,0));
}
.nearby .location-categories button .material-icons {
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  margin:0;
  border:1px solid color-mix(in srgb,var(--lup-category-ink) 32%,transparent);
  border-radius:10px 10px 10px 5px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--lup-category-ink) 14%,#424454),rgba(21,23,35,.78));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 5px 11px rgba(0,0,0,.20);
  color:var(--lup-category-ink);
  font-size:18px;
  line-height:1;
  opacity:1;
  text-shadow:0 0 9px color-mix(in srgb,var(--lup-category-ink) 45%,transparent);
}
.nearby .location-categories button span {
  margin-top:5px;
  color:inherit;
  font-size:7.5px;
  font-weight:780;
  letter-spacing:.015em;
}
.nearby .location-categories button:hover:not(.active) .material-icons {
  transform:translateY(-1px);
  border-color:color-mix(in srgb,var(--lup-category-ink) 52%,transparent);
}
.nearby .location-categories button.active {
  color:#faf9ff;
  background:linear-gradient(145deg,color-mix(in srgb,var(--lup-category-ink) 14%,rgba(255,255,255,.07)),rgba(255,255,255,.025));
}
.nearby .location-categories button.active .material-icons {
  transform:translateY(-2px);
  border-color:color-mix(in srgb,var(--lup-category-ink) 68%,#fff);
  background:linear-gradient(145deg,color-mix(in srgb,var(--lup-category-ink) 34%,#52566a),color-mix(in srgb,var(--lup-category-ink) 16%,#232637));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--lup-category-ink) 9%,transparent),0 0 17px color-mix(in srgb,var(--lup-category-ink) 25%,transparent),inset 0 1px 0 rgba(255,255,255,.30),0 6px 13px rgba(0,0,0,.24);
  color:#fff;
}

/* Six labels need a deliberate two-line rhythm on phones. This keeps every
   category legible instead of squeezing words into overlapping fragments. */
.nearby .location-categories { min-height:70px; padding:5px 4px; }
.nearby .location-categories button { min-height:60px; padding:4px 1px 3px; }
.nearby .location-categories button .material-icons {
  width:32px;
  height:32px;
  border-radius:11px 11px 11px 5px;
  font-size:19px;
}
.nearby .location-categories button span {
  display:grid;
  min-height:17px;
  margin-top:4px;
  overflow:visible;
  color:color-mix(in srgb,var(--lup-category-ink) 74%,#f4f2fa);
  font-size:7px;
  font-weight:800;
  line-height:1.12;
  text-align:center;
  text-overflow:clip;
  white-space:normal;
}
.nearby .location-categories button.active span { color:#fff; text-shadow:0 0 8px var(--lup-circuit-glow); }


/* Chat entry is a connected surface in the place panel: an icon seal, clear
   label and a quiet directional mark—not a generic raised button. */
.nearby .chatbutton:not(.chatbutton--locked) {
  width:min(91%,356px);
  margin:11px auto 0;
}
.nearby .chatbutton:not(.chatbutton--locked) button {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  height:48px;
  min-height:48px;
  margin:0;
  padding:0 17px;
  border:1px solid color-mix(in srgb,var(--lup-place-accent) 26%,rgba(255,255,255,.10));
  border-radius:15px;
  background:linear-gradient(110deg,color-mix(in srgb,var(--lup-place-accent) 15%,#303348),rgba(29,31,46,.92) 70%);
  box-shadow:inset 3px 0 0 color-mix(in srgb,var(--lup-place-accent) 74%,transparent),inset 0 1px 0 rgba(255,255,255,.13),0 8px 17px rgba(0,0,0,.18);
  color:#f7f5ff;
  font-size:12px;
  font-weight:820;
  letter-spacing:.035em;
  text-shadow:none;
}
.nearby .chatbutton:not(.chatbutton--locked) button::before {
  display:grid;
  place-items:center;
  width:25px;
  height:25px;
  margin:0;
  border:1px solid color-mix(in srgb,var(--lup-place-accent) 46%,transparent);
  border-radius:8px 8px 8px 4px;
  background:color-mix(in srgb,var(--lup-place-accent) 16%,transparent);
  color:var(--lup-place-accent);
  font-size:16px;
  line-height:1;
  text-shadow:0 0 8px var(--lup-place-glow);
}
.nearby .chatbutton:not(.chatbutton--locked) button::after {
  right:12px;
  bottom:auto;
  left:auto;
  width:0;
  height:0;
  border-top:5px solid transparent;
  border-bottom:5px solid transparent;
  border-left:6px solid color-mix(in srgb,var(--lup-place-accent) 74%,#fff);
  border-radius:0;
  background:none;
  box-shadow:none;
}
.nearby .chatbutton:not(.chatbutton--locked) button:hover {
  background:linear-gradient(110deg,color-mix(in srgb,var(--lup-place-accent) 23%,#303348),rgba(34,36,53,.96) 70%);
  filter:none;
}
.nearby .chatbutton:not(.chatbutton--locked) button:active { transform:translateY(1px); }

/* A restrained invitation: slightly warmer glass and a barely visible light
   sweep make the available entry feel welcoming without becoming a banner. */
.nearby .chatbutton:not(.chatbutton--locked) button {
  border-color:color-mix(in srgb,var(--lup-place-accent) 34%,rgba(255,255,255,.10));
  background:linear-gradient(108deg,color-mix(in srgb,var(--lup-place-accent) 20%,#34374d),rgba(31,34,49,.94) 64%,rgba(42,44,62,.87));
  box-shadow:inset 3px 0 0 color-mix(in srgb,var(--lup-place-accent) 82%,transparent),inset 0 1px 0 rgba(255,255,255,.19),0 8px 18px rgba(0,0,0,.19),0 0 16px color-mix(in srgb,var(--lup-place-glow) 44%,transparent);
}
.nearby .chatbutton:not(.chatbutton--locked) button::before {
  background:linear-gradient(145deg,color-mix(in srgb,var(--lup-place-accent) 26%,rgba(255,255,255,.10)),color-mix(in srgb,var(--lup-place-accent) 9%,transparent));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.17),0 0 10px color-mix(in srgb,var(--lup-place-glow) 58%,transparent);
}
.nearby .chatbutton:not(.chatbutton--locked) button::after {
  border-left-color:color-mix(in srgb,var(--lup-place-accent) 64%,#fff);
  filter:drop-shadow(0 0 4px var(--lup-place-glow));
}

/* The out-of-range state uses the exact same entry surface. It communicates
   distance with a calm lock marker instead of shrinking into a different UI. */
.nearby .chatbutton.chatbutton--locked {
  width:min(91%,356px);
  margin:11px auto 0;
}
.nearby .chatbutton.chatbutton--locked button {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  float:none;
  width:100%;
  height:48px;
  min-height:48px;
  margin:0;
  padding:0 17px;
  border:1px solid color-mix(in srgb,var(--lup-place-accent) 18%,rgba(255,255,255,.08));
  border-radius:15px;
  background:linear-gradient(110deg,color-mix(in srgb,var(--lup-place-accent) 8%,#292b3d),rgba(25,27,39,.78) 70%);
  box-shadow:inset 3px 0 0 color-mix(in srgb,var(--lup-place-accent) 36%,transparent),inset 0 1px 0 rgba(255,255,255,.08),0 8px 17px rgba(0,0,0,.14);
  color:#bcb8cb;
  font-size:11px;
  font-weight:760;
  letter-spacing:.025em;
  opacity:1;
}
.nearby .chatbutton.chatbutton--locked button::before {
  content:'lock_outline';
  display:grid;
  place-items:center;
  width:25px;
  height:25px;
  margin:0;
  border:1px solid color-mix(in srgb,var(--lup-place-accent) 28%,transparent);
  border-radius:8px 8px 8px 4px;
  background:color-mix(in srgb,var(--lup-place-accent) 9%,transparent);
  color:color-mix(in srgb,var(--lup-place-accent) 62%,#d8d3e5);
  font-family:'Material Icons';
  font-size:15px;
  line-height:1;
}
.nearby .chatbutton.chatbutton--locked button::after {
  content:'';
  position:absolute;
  right:12px;
  bottom:auto;
  left:auto;
  width:5px;
  height:5px;
  border:1px solid color-mix(in srgb,var(--lup-place-accent) 48%,transparent);
  border-radius:50%;
  background:color-mix(in srgb,var(--lup-place-accent) 45%,transparent);
  box-shadow:0 0 8px var(--lup-place-glow);
}

/* A room chat inherits its venue's atmosphere without becoming a visual
   distraction behind actual conversation. */
.location-chat-surface {
  --chat-accent:#9d8bff;
  --chat-glow:rgba(135,110,241,.20);
  position:relative;
  overflow:hidden;
  background:radial-gradient(circle at 92% 7%,var(--chat-glow),transparent 36%),linear-gradient(155deg,#191b2b,#12141f 76%);
}
.location-chat-surface.location-category-city { --chat-accent:#91c9ff; --chat-glow:rgba(91,171,246,.19); }.location-chat-surface.location-category-bar,.location-chat-surface.location-category-food { --chat-accent:#efb17c; --chat-glow:rgba(226,125,79,.18); }.location-chat-surface.location-category-cafe { --chat-accent:#e1bd8b; --chat-glow:rgba(198,149,96,.18); }.location-chat-surface.location-category-club { --chat-accent:#ea91e3; --chat-glow:rgba(204,86,205,.20); }.location-chat-surface.location-category-culture { --chat-accent:#91c9ee; --chat-glow:rgba(80,160,219,.18); }.location-chat-surface.location-category-sport,.location-chat-surface.location-category-outdoors { --chat-accent:#88d4a5; --chat-glow:rgba(70,182,127,.18); }.location-chat-surface.location-category-education { --chat-accent:#90dae7; --chat-glow:rgba(78,185,204,.18); }.location-chat-surface.location-category-health { --chat-accent:#f2a0b7; --chat-glow:rgba(223,98,141,.18); }
.location-chat-surface .chat-location-atmosphere { position:absolute; z-index:0; top:-34px; right:-26px; display:grid; place-items:center; width:178px; height:178px; border:1px solid color-mix(in srgb,var(--chat-accent) 23%,transparent); border-radius:50%; box-shadow:0 0 0 25px color-mix(in srgb,var(--chat-accent) 5%,transparent),0 0 42px var(--chat-glow); color:color-mix(in srgb,var(--chat-accent) 34%,#fff); opacity:.28; pointer-events:none; transform:rotate(-14deg); }
.location-chat-surface .chat-location-atmosphere .material-icons { font-size:96px; text-shadow:0 0 22px var(--chat-glow); }
.location-chat-surface .chat-msgs { position:relative; z-index:1; background:linear-gradient(180deg,rgba(16,18,29,.25),rgba(16,18,29,.60)); }

/* Quiet parks and similar places deliberately share the calm outdoor palette. */
.nearby .room-category-hero.category-relaxation { --lup-place-accent:#8fcb8a; --lup-place-glow:rgba(143,203,138,.18); }
.location-hero.location-category-relaxation { --location-accent:#83d2a2; --location-glow:rgba(75,192,135,.28); }
.location-chat-surface.location-category-relaxation { --chat-accent:#88d4a5; --chat-glow:rgba(70,182,127,.18); }
.location-chat-surface .chatbottom { position:relative; z-index:2; height:64px; padding:9px 11px; background:rgba(18,20,31,.82); border-top-color:color-mix(in srgb,var(--chat-accent) 22%,rgba(255,255,255,.08)); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
.location-chat-surface .chatbottom input { height:42px; padding:0 13px; border-radius:13px; border-color:color-mix(in srgb,var(--chat-accent) 27%,rgba(255,255,255,.15)); background:rgba(38,40,59,.78); font-size:13px; }
.location-chat-surface .chatbottom .chat-button { flex:0 0 44px; width:44px; height:44px; margin-left:8px; border:1px solid color-mix(in srgb,var(--chat-accent) 48%,rgba(255,255,255,.20)); border-radius:14px; background:linear-gradient(135deg,color-mix(in srgb,var(--chat-accent) 66%,#8f77ef),color-mix(in srgb,var(--chat-accent) 40%,#4e7fc9)); box-shadow:0 6px 14px var(--chat-glow),inset 0 1px 0 rgba(255,255,255,.28); }
.location-chat-surface .chatbottom button,
.location-chat-surface .chatbottom button.sendmessage { width:20px; height:20px; min-width:20px; max-width:20px; }

/* Final mini-presence avatar reset. The directive renders a background-image
   div, so an old padded avatar shell otherwise peeks through at top left. */
.nearby .room-user-preview .lup-avatar {
  padding:0;
  overflow:hidden;
  background:transparent;
  box-shadow:none;
  border:1px solid rgba(183,199,239,.42);
}
.nearby .room-user-preview .lup-avatar .img {
  top:0;
  left:0;
  width:100%;
  height:100%;
  border-radius:50%;
}
.nearby .room-user-preview .lup-avatar span { display:none; }

/* The location/chat/online rail is one surface. Remove Angular Material's
   leftover canvas and focus borders that became visible after selecting Chat. */
.location-page md-tabs,
.location-page md-tabs-wrapper,
.location-page md-tabs-canvas,
.location-page md-pagination-wrapper,
.location-page md-tabs-content-wrapper {
  border:0;
  box-shadow:none;
}
.location-page md-tabs md-tab-item:focus { outline:0; }

/* Online room: a calm live lounge rather than a plain white list. */
.location-page md-list.usernavigation {
  min-height:100%;
  padding:16px 13px 28px;
  background:
    radial-gradient(circle at 88% 3%,rgba(110,144,244,.18),transparent 28%),
    radial-gradient(circle at 8% 18%,rgba(105,217,165,.10),transparent 24%),
    linear-gradient(160deg,#191c2a,#11141e 82%);
}
.location-page md-list.usernavigation .location-presence-heading {
  position:relative;
  overflow:hidden;
  margin:0 0 14px;
  border-color:rgba(145,184,255,.22);
  border-radius:18px;
  background:linear-gradient(120deg,rgba(79,126,202,.25),rgba(102,77,176,.16));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 12px 25px rgba(0,0,0,.16);
}
.location-page md-list.usernavigation .location-presence-heading::after { content:''; position:absolute; top:-28px; right:-18px; width:92px; height:92px; border:1px solid rgba(191,215,255,.18); border-radius:50%; box-shadow:0 0 0 15px rgba(191,215,255,.035); }
.location-page md-list.usernavigation .location-presence-heading > * { position:relative; z-index:1; }
.location-page md-list.usernavigation .location-presence-heading > .material-icons { border:1px solid rgba(157,235,198,.30); background:rgba(89,203,151,.13); color:#8be2b5; box-shadow:0 0 17px rgba(91,218,160,.14); }
.location-page md-list.usernavigation .visitors-list { padding:0; background:transparent; }
.location-page md-list.usernavigation .presence-person {
  position:relative;
  overflow:hidden;
  min-height:70px;
  margin:8px 0;
  padding:8px 10px;
  border-color:rgba(255,255,255,.075);
  border-radius:17px;
  background:linear-gradient(108deg,rgba(255,255,255,.060),rgba(255,255,255,.025));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055);
}
.location-page md-list.usernavigation .presence-person::before { content:''; position:absolute; top:14px; bottom:14px; left:0; width:2px; border-radius:0 2px 2px 0; background:linear-gradient(#7ddcab,#6f9bdf); opacity:.68; }
.location-page md-list.usernavigation .presence-person:hover { background:linear-gradient(108deg,rgba(111,153,222,.18),rgba(107,192,159,.09)); border-color:rgba(153,192,255,.25); }
.location-page md-list.usernavigation .presence-person .presence-avatar { outline-color:rgba(147,214,188,.35); }
.location-page md-list.usernavigation .presence-actions .usericon { border:1px solid rgba(255,255,255,.09); border-radius:10px; background-color:rgba(255,255,255,.055); }
.location-page md-list.usernavigation .presence-actions .sendmessage { border-color:rgba(166,150,255,.28); background-color:rgba(132,107,234,.22); }

/* Three clear, equally weighted actions for a person currently at the venue. */
.location-page md-list.usernavigation .presence-actions {
  display:flex;
  align-items:center;
  gap:6px;
  margin-left:8px;
}
.location-page md-list.usernavigation .presence-actions .presence-action {
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  min-width:34px;
  padding:0;
  border:1px solid rgba(210,220,255,.16);
  border-radius:11px;
  background:linear-gradient(145deg,rgba(255,255,255,.10),rgba(255,255,255,.035));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.13),0 6px 13px rgba(0,0,0,.16);
  color:#e8edff;
  cursor:pointer;
  transition:transform .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.location-page md-list.usernavigation .presence-actions .presence-action:hover,
.location-page md-list.usernavigation .presence-actions .presence-action:focus {
  transform:translateY(-2px);
  outline:0;
}
.location-page md-list.usernavigation .presence-actions .presence-action:active { transform:translateY(0) scale(.94); }
.location-page md-list.usernavigation .presence-actions .presence-action .material-icons { font-size:18px; }
.location-page md-list.usernavigation .presence-actions .presence-message { border-color:rgba(164,147,255,.40); background:linear-gradient(145deg,rgba(144,111,234,.43),rgba(91,103,207,.25)); box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 6px 15px rgba(119,103,232,.20); }
.location-page md-list.usernavigation .presence-actions .presence-friend { border-color:rgba(119,220,188,.36); background:linear-gradient(145deg,rgba(69,181,146,.34),rgba(74,121,170,.22)); }
.location-page md-list.usernavigation .presence-actions .presence-pending { border-color:rgba(244,192,112,.42); background:linear-gradient(145deg,rgba(209,147,72,.40),rgba(142,102,73,.24)); color:#fff0d3; }
.location-page md-list.usernavigation .presence-actions .presence-connected { border-color:rgba(239,144,164,.36); background:linear-gradient(145deg,rgba(190,77,109,.35),rgba(117,72,105,.23)); color:#ffe4e9; }
.location-page md-list.usernavigation .presence-actions .presence-up { border-color:rgba(255,209,115,.42); background:linear-gradient(145deg,rgba(220,165,61,.42),rgba(180,98,84,.22)); color:#fff5d4; }
@media (max-width:390px) {
  .location-page md-list.usernavigation .presence-actions { gap:4px; margin-left:4px; }
  .location-page md-list.usernavigation .presence-actions .presence-action { width:30px; height:30px; min-width:30px; border-radius:10px; }
  .location-page md-list.usernavigation .presence-actions .presence-action .material-icons { font-size:16px; }
}

/* Friend arrival: one useful live signal, styled as part of LinkUUp rather
   than a generic browser message. */
md-toast.lup-friend-arrival-toast {
  min-width:280px;
  max-width:calc(100vw - 28px);
  margin:14px;
  border:1px solid rgba(145,212,255,.34);
  border-radius:15px;
  background:linear-gradient(135deg,rgba(52,88,146,.97),rgba(54,48,108,.98));
  box-shadow:0 15px 34px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.18);
  color:#f2f7ff;
}
md-toast.lup-friend-arrival-toast .md-toast-content { min-height:58px; padding:10px 12px 10px 15px; background:transparent; }
md-toast.lup-friend-arrival-toast .md-toast-text { font-size:12px; font-weight:700; line-height:1.35; }
md-toast.lup-friend-arrival-toast .md-button { min-width:0; margin:0; padding:0 10px; border-radius:10px; background:rgba(167,225,255,.13); color:#d8f3ff; font-size:11px; font-weight:850; }

/* Phone login: two balanced utility links and compact entry controls. */
@media (max-width:780px) {
  .auth-hero { min-height:214px; }
  .auth-hero-copy { padding:20px 22px; }
  .auth-mark { width:40px; height:40px; margin-bottom:10px; }
  .auth-mark .material-icons { font-size:20px; }
  .auth-shell .login-wordmark { font-size:43px; }
  .auth-shell .login-brand-claim { margin-top:8px; font-size:11px; }
  .auth-panel { margin:0 auto 16px; padding:24px 23px 20px; }
  .auth-kicker { margin-bottom:7px; }
  .auth-panel > h1 { font-size:25px; }
  .auth-intro { margin:7px 0 15px; font-size:12px; }
  .auth-panel md-input-container { margin-bottom:10px; }
  .auth-panel .login-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:0 0 5px; padding:0; }
  .auth-panel .signup,.auth-panel .pwforgot { margin:0; font-size:11px; line-height:1.35; }
  .auth-panel .signup { text-align:left; }
  .auth-panel .pwforgot { text-align:right; }
  .auth-panel .login-button { min-height:44px; height:44px; margin:7px 0 0; border-radius:12px; font-size:13px; }
  .auth-panel .login-social { display:flex; gap:8px; margin:7px 0 0; }
  .auth-panel .facebook-button,.auth-panel .instagram-button { flex:1 1 0; min-height:38px; height:38px; margin:0; border-radius:11px; }
  .auth-panel .facebook-button span,.auth-panel .instagram-button span { transform:scale(.64); }
  .auth-panel .guest-button { min-height:40px; height:40px; margin:7px 0 0; border-radius:12px; font-size:11px; }
  .auth-legal { min-height:47px; }
}

/* Public entry, rebuilt as one calm spatial surface. Kept at the end so the
   legacy Material login rules cannot leak into this first impression. */
.auth-shell,.auth-shell .auth-canvas { min-height:100svh; background:#0b1020; }
.auth-shell .auth-canvas { position:relative; display:grid; grid-template-columns:minmax(0,1.16fr) minmax(390px,.84fr); grid-template-rows:minmax(0,1fr) auto; overflow:hidden; isolation:isolate; color:#f3f7ff; }
.auth-shell .auth-canvas::before,.auth-shell .auth-canvas::after { content:''; position:absolute; z-index:-1; pointer-events:none; }
.auth-shell .auth-canvas::before { inset:0; background:radial-gradient(ellipse 52% 48% at 21% 19%,rgba(74,151,218,.19),transparent 73%),radial-gradient(ellipse 38% 42% at 76% 76%,rgba(113,83,196,.16),transparent 74%),linear-gradient(145deg,#111a2b 0%,#0b1020 60%,#0b0f1c 100%); }
.auth-shell .auth-canvas::after { inset:0; opacity:.36; background-image:radial-gradient(rgba(182,221,255,.34) .65px,transparent .8px); background-size:24px 24px; mask-image:linear-gradient(90deg,#000,transparent 72%); }
.auth-hero,.auth-panel,.auth-legal { position:relative; z-index:1; }
.auth-hero { display:grid; place-items:center; min-height:calc(100svh - 56px); overflow:hidden; border:0; border-right:1px solid rgba(193,222,255,.10); background:transparent; }
.auth-hero::before,.auth-hero::after { content:''; position:absolute; pointer-events:none; border-radius:50%; }
.auth-hero::before { width:min(56vw,700px); height:min(56vw,700px); border:1px solid rgba(169,219,255,.11); box-shadow:0 0 0 48px rgba(165,207,255,.025),0 0 0 116px rgba(165,207,255,.014); transform:translate(-19%,-18%); }
.auth-hero::after { width:340px; height:340px; right:-155px; bottom:-165px; background:radial-gradient(circle,rgba(103,92,204,.24),transparent 68%); filter:blur(8px); }
.auth-hero-copy { position:relative; z-index:2; width:min(100%,468px); padding:42px; text-align:left; }
.auth-hero-meta { display:flex; align-items:center; gap:8px; margin:0 0 29px; color:#9bbbd5; font-size:10px; font-weight:800; letter-spacing:.17em; }
.auth-hero-meta span,.auth-kicker span { display:inline-block; width:7px; height:7px; border-radius:50%; background:#83e0ba; box-shadow:0 0 0 4px rgba(131,224,186,.12),0 0 14px rgba(131,224,186,.75); }
.auth-mark { display:grid; place-items:center; width:56px; height:56px; margin:0 0 20px; border:1px solid rgba(205,234,255,.38); border-radius:20px 20px 20px 7px; background:linear-gradient(145deg,rgba(93,166,223,.82),rgba(89,71,178,.82)); box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 16px 36px rgba(24,51,128,.32),0 0 32px rgba(113,195,255,.18); color:#fff; }
.auth-mark .material-icons { font-size:28px; }
.auth-shell .login-wordmark { margin:0; color:#f7fbff; font-family:Inter,Arial,sans-serif; font-size:clamp(52px,6.4vw,82px); font-weight:350; letter-spacing:-.09em; line-height:.84; text-align:left; text-shadow:0 12px 30px rgba(0,0,0,.28); text-transform:lowercase; }
.auth-shell .login-wordmark-link { color:#f2f6ff; font-weight:350; }
.auth-shell .login-wordmark-up { margin-left:.055em; background:linear-gradient(130deg,#dfefff 0%,#a4d6f8 43%,#b9a3ff 100%); -webkit-background-clip:text; background-clip:text; color:transparent; font-weight:820; }
.auth-shell .login-brand-claim { margin:22px 0 0; color:#f0f4ff; font-size:clamp(21px,2.3vw,29px); font-weight:560; letter-spacing:-.04em; line-height:1.08; text-align:left; }
.auth-hero-detail { max-width:30ch; margin:14px 0 0; color:#aebed0; font-size:13px; line-height:1.55; }
.auth-route { position:absolute; inset:0; width:100%; height:100%; opacity:.83; }
.auth-route-base { stroke:rgba(158,212,250,.22); stroke-width:1.15; }
.auth-route-light { stroke:#b7e9ff; stroke-width:2.4; stroke-dasharray:42 1800; filter:drop-shadow(0 0 5px #91d8ff) drop-shadow(0 0 13px rgba(102,120,236,.45)); animation:auth-route-travel 13s linear infinite; }
.auth-route-point { fill:#e6f8ff; stroke:#96d5f6; stroke-width:2; animation:auth-route-point 5.4s ease-in-out infinite; }
.auth-panel { align-self:center; width:min(100%,476px); margin:0 auto; padding:46px clamp(30px,5vw,58px) 38px; border:1px solid rgba(196,223,255,.12); border-radius:26px; background:linear-gradient(145deg,rgba(27,35,57,.72),rgba(13,18,32,.72)); box-shadow:0 26px 64px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.08); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
.auth-kicker { display:flex; align-items:center; gap:8px; margin:0 0 12px; color:#9cccf0; font-size:9px; font-weight:850; letter-spacing:.18em; }
.auth-kicker span { width:5px; height:5px; }
.auth-panel > h1 { margin:0; color:#f4f7ff; font-size:clamp(29px,3vw,37px); font-weight:620; letter-spacing:-.055em; line-height:1.05; }
.auth-intro { max-width:34ch; margin:12px 0 29px; color:#aebcd0; font-size:13px; line-height:1.56; }
.auth-panel .login-credentials { width:100%; margin:0; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
.auth-panel md-input-container { width:100%; margin:0 0 17px; border:0; }
.auth-panel md-input-container > label { padding-left:1px; color:#a8b9cc; font-size:10px; font-weight:800; letter-spacing:.065em; }
.auth-panel md-input-container.md-input-focused > label { color:#bce9ff; }
.auth-panel md-input-container .md-input,.auth-panel input[type=text],.auth-panel input[type=email],.auth-panel input[type=password] { min-height:49px; width:100%; padding:0 14px; box-sizing:border-box; border:1px solid rgba(190,218,250,.16); border-radius:13px; background:rgba(5,10,21,.42); box-shadow:inset 0 1px 0 rgba(255,255,255,.04); color:#f4f8ff; font-size:14px; line-height:49px; transition:border-color .18s ease,box-shadow .18s ease,background .18s ease; }
.auth-panel md-input-container .md-input:focus,.auth-panel input:focus { border-color:rgba(146,211,250,.75); background:rgba(8,15,29,.72); box-shadow:0 0 0 3px rgba(104,186,239,.13),inset 0 1px 0 rgba(255,255,255,.05); }
.auth-panel .login-links { display:flex; align-items:center; gap:14px; margin:-1px 0 10px; padding:0; }
.auth-panel .signup,.auth-panel .pwforgot { width:auto; margin:0; font-size:11px; line-height:1.45; }
.auth-panel .pwforgot { margin-left:auto; text-align:right; }
.auth-panel .signup a,.auth-panel .pwforgot a { color:#b9e2fb; font-weight:720; text-decoration:none; }
.auth-panel .login-submit,.auth-panel .login-google,.auth-panel .login-social,.auth-panel .login-guest { width:100%; padding:0; }
.auth-panel .login-button { width:100%; min-height:50px; height:50px; margin:10px 0 0; border:1px solid rgba(224,240,255,.31); border-radius:13px; background:linear-gradient(108deg,#5794c6,#735fc4); box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 13px 25px rgba(54,75,168,.28); color:#fff; font-size:13px; font-weight:820; letter-spacing:.02em; text-transform:none; }
.auth-panel .login-button:hover { filter:brightness(1.08) saturate(1.04); transform:translateY(-1px); }
.auth-panel .login-button:active { transform:translateY(1px); }
.auth-panel .google-button { display:block; width:100%; min-height:42px; height:42px; margin:9px 0 0; border:1px solid rgba(195,222,255,.16); border-radius:12px; background:rgba(7,13,27,.38); box-shadow:none; color:#eaf4ff; font-size:12px; font-weight:740; text-transform:none; }
.auth-panel .google-button:hover { background:rgba(116,163,215,.13); }
.auth-panel .google-mark { margin-right:8px; color:#9cd8f8; font-family:Arial,sans-serif; font-size:17px; font-weight:850; }
.auth-panel .login-social { display:flex; gap:9px; margin-top:10px; }
.auth-panel .facebook-button,.auth-panel .instagram-button { flex:1 1 0; min-width:0; height:40px; min-height:40px; margin:0; border:1px solid rgba(195,222,255,.13); border-radius:12px; background:rgba(7,13,27,.38); box-shadow:none; }
.auth-panel .facebook-button:hover,.auth-panel .instagram-button:hover { background:rgba(116,163,215,.13); }
.auth-panel .facebook-button span,.auth-panel .instagram-button span { width:21px; height:21px; background-size:contain; opacity:.88; }
.auth-panel .guest-button { width:100%; min-height:42px; height:42px; margin:10px 0 0; border:0; border-radius:12px; background:transparent; box-shadow:none; color:#aabfd1; font-size:11px; font-weight:700; text-transform:none; }
.auth-panel .guest-button:hover { color:#e3f4ff; background:rgba(132,185,232,.07); }
.auth-legal { grid-column:1 / -1; min-height:56px; border-top:1px solid rgba(190,218,250,.09); background:rgba(4,8,18,.22); }
.auth-legal button { color:#8093aa; }.auth-legal button:hover { color:#c7e8ff; }
@media (max-width:780px) {
  .auth-shell .auth-canvas { display:block; min-height:100svh; overflow:auto; }
  .auth-hero { min-height:263px; border-right:0; border-bottom:1px solid rgba(193,222,255,.09); }
  .auth-hero-copy { width:100%; padding:26px 28px 25px; box-sizing:border-box; }
  .auth-hero-meta { margin-bottom:16px; font-size:8px; }
  .auth-mark { width:42px; height:42px; margin-bottom:12px; border-radius:15px 15px 15px 5px; }.auth-mark .material-icons { font-size:22px; }
  .auth-shell .login-wordmark { font-size:51px; }.auth-shell .login-brand-claim { margin-top:13px; font-size:21px; }.auth-hero-detail { margin-top:8px; font-size:11px; }
  .auth-route { height:290px; top:-6px; }
  .auth-panel { width:calc(100% - 28px); margin:17px auto 18px; padding:27px 22px 22px; border-radius:21px; }.auth-panel > h1 { font-size:28px; }.auth-intro { margin:9px 0 18px; font-size:12px; }.auth-panel md-input-container { margin-bottom:11px; }.auth-panel .login-links { margin:0 0 5px; }.auth-panel .login-button { min-height:46px; height:46px; margin-top:8px; }.auth-panel .login-social { margin-top:8px; }.auth-panel .facebook-button,.auth-panel .instagram-button { min-height:38px; height:38px; }.auth-panel .guest-button { min-height:38px; height:38px; margin-top:6px; }.auth-legal { min-height:48px; }
}
@media (max-width:360px) { .auth-hero { min-height:244px; }.auth-hero-copy { padding:20px 24px; }.auth-shell .login-wordmark { font-size:46px; }.auth-panel { padding:23px 18px 18px; } }
@media (prefers-reduced-motion:reduce) { .auth-route-light,.auth-route-point { animation:none; } }

/* Live room: the online tab is a place, not a generic member list.  The
   header explains the state once; calm visitor rows make 1 and 50 guests
   equally easy to scan without changing any presence or friend logic. */
.location-page md-list.usernavigation {
  position:relative;
  isolation:isolate;
  padding:18px 16px 20px;
  overflow:hidden;
  background:
    radial-gradient(ellipse 72% 34% at 15% 0%,rgba(71,151,223,.16),transparent 70%),
    radial-gradient(ellipse 48% 32% at 92% 29%,rgba(123,83,207,.15),transparent 76%),
    linear-gradient(155deg,#121b2d 0%,#0c1220 75%);
}
.location-page md-list.usernavigation::before {
  content:'';
  position:absolute;
  z-index:-1;
  top:-35px;
  right:-48px;
  width:220px;
  height:220px;
  border:1px solid rgba(162,217,255,.10);
  border-radius:50%;
  box-shadow:0 0 0 38px rgba(162,217,255,.018),0 0 0 86px rgba(162,217,255,.012);
}
.location-page md-list.usernavigation .location-presence-heading { margin:0 0 13px; }
.location-page md-list.usernavigation .location-presence-heading .md-subheader-inner {
  min-height:59px;
  padding:0 3px 12px;
  gap:10px;
  border:0;
  border-bottom:1px solid rgba(183,216,248,.16);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.location-page md-list.usernavigation .location-presence-heading .presence-live-mark {
  flex:0 0 37px;
  width:37px;
  height:37px;
  border:1px solid rgba(127,212,255,.45);
  border-radius:13px 13px 13px 5px;
  background:linear-gradient(145deg,rgba(70,163,225,.32),rgba(83,79,181,.20));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.17),0 0 18px rgba(77,177,248,.18);
  color:#d4f1ff;
}
.location-page md-list.usernavigation .presence-live-mark .material-icons { animation:lup-presence-pin 3s ease-in-out infinite; }
.location-page md-list.usernavigation .location-presence-heading .presence-header-copy strong { color:#f2f7ff; font-size:14px; font-weight:760; letter-spacing:-.015em; }
.location-page md-list.usernavigation .location-presence-heading .presence-header-copy span { margin-top:3px; color:#9daec4; font-size:10px; }
.location-page md-list.usernavigation .location-presence-heading .presence-total {
  position:relative;
  top:auto;
  right:auto;
  flex:0 0 46px;
  min-width:46px;
  min-height:39px;
  padding:4px 5px;
  border:1px solid rgba(130,223,178,.26);
  border-radius:12px;
  background:rgba(76,179,137,.09);
}
.location-page md-list.usernavigation .presence-total strong { color:#f5fffa; font-size:19px; font-weight:800; }
.location-page md-list.usernavigation .presence-total small { color:#8ce5b5; font-size:7px; }
.location-page md-list.usernavigation .visitors-list { display:block; max-height:calc(100dvh - 214px); padding:1px 1px 12px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:rgba(141,197,255,.40) transparent; }
.location-page md-list.usernavigation .presence-empty { display:grid; justify-items:center; gap:6px; padding:34px 19px; border:1px dashed rgba(160,202,241,.18); border-radius:17px; background:rgba(10,16,30,.23); color:#a7b8cc; text-align:center; }.location-page md-list.usernavigation .presence-empty .material-icons { color:#9edcff; font-size:25px; opacity:.84; }.location-page md-list.usernavigation .presence-empty strong { color:#e7f2ff; font-size:13px; }.location-page md-list.usernavigation .presence-empty span { font-size:11px; line-height:1.45; }
.location-page md-list.usernavigation .presence-person {
  min-height:72px;
  margin:8px 0;
  padding:11px 10px 11px 12px;
  border:1px solid rgba(184,208,255,.11);
  border-radius:16px;
  background:linear-gradient(112deg,rgba(65,85,137,.20),rgba(22,28,45,.64) 67%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.065),0 9px 20px rgba(0,0,0,.10);
}
.location-page md-list.usernavigation .presence-person::before { top:14px; bottom:14px; width:2px; background:linear-gradient(#82d9ff,#8be0b2); opacity:.74; }
.location-page md-list.usernavigation .presence-person:hover { border-color:rgba(155,209,255,.30); background:linear-gradient(112deg,rgba(82,124,184,.27),rgba(27,35,58,.72) 67%); }
.location-page md-list.usernavigation .presence-person .presence-avatar { width:46px; height:46px; margin-right:12px; outline:1px solid rgba(149,222,251,.39); outline-offset:3px; }.location-page md-list.usernavigation .presence-person .presence-avatar img { width:46px; height:46px; }
.location-page md-list.usernavigation .presence-person-copy .username { margin:0 0 4px; color:#f6f9ff; font-size:13px; font-weight:750; }.location-page md-list.usernavigation .presence-person-copy p:last-child { color:#9eafc4; font-size:10px; }.location-page md-list.usernavigation .presence-person-copy p:last-child .material-icons { color:#84dcb1; font-size:11px; }
.location-page md-list.usernavigation .presence-actions { gap:4px; margin-left:8px; padding:3px; border:1px solid rgba(255,255,255,.07); border-radius:12px; background:rgba(5,10,21,.24); }
.location-page md-list.usernavigation .presence-actions .presence-action { width:31px; height:31px; min-width:31px; padding:0; border:1px solid rgba(192,220,255,.11); border-radius:9px; background:rgba(255,255,255,.045); box-shadow:none; }.location-page md-list.usernavigation .presence-actions .presence-action .material-icons { font-size:16px; }.location-page md-list.usernavigation .presence-actions .presence-action:hover,.location-page md-list.usernavigation .presence-actions .presence-action:focus-visible { transform:translateY(-1px); filter:brightness(1.15); }
.location-page md-list.usernavigation .presence-actions .presence-message { color:#dcd4ff; border-color:rgba(174,155,255,.28); background:rgba(132,107,234,.19); }.location-page md-list.usernavigation .presence-actions .presence-friend { color:#baf3dc; border-color:rgba(120,225,187,.26); background:rgba(71,178,143,.15); }.location-page md-list.usernavigation .presence-actions .presence-pending { color:#ffe1a8; background:rgba(180,126,55,.15); }.location-page md-list.usernavigation .presence-actions .presence-connected { color:#c5e9ff; background:rgba(72,137,191,.17); }.location-page md-list.usernavigation .presence-actions .presence-up { color:#ffe18a; }
@media (min-width:560px) { .location-page md-list.usernavigation .presence-actions .presence-action { width:auto; min-width:33px; padding:0 8px; }.location-page md-list.usernavigation .presence-actions .presence-action span { display:inline; font-size:9px; font-weight:800; } }
@media (max-width:360px) { .location-page md-list.usernavigation { padding-right:11px; padding-left:11px; }.location-page md-list.usernavigation .presence-person { padding-right:7px; padding-left:9px; }.location-page md-list.usernavigation .presence-person .presence-avatar,.location-page md-list.usernavigation .presence-person .presence-avatar img { width:40px; height:40px; }.location-page md-list.usernavigation .presence-actions { gap:2px; margin-left:4px; }.location-page md-list.usernavigation .presence-actions .presence-action { width:28px; height:28px; min-width:28px; } }
@media (prefers-reduced-motion:reduce) { .location-page md-list.usernavigation .presence-live-mark .material-icons { animation:none; } }

/* End-of-sheet query correction: legacy sections above this point intentionally
   cannot override this final geometry. */
.query-page .query-message-card {
  display:flex;
  align-items:center;
  width:100%;
  min-height:62px;
  margin:0;
  padding:10px 13px;
  gap:12px;
}
.query-page .query-message-avatar {
  display:block;
  flex:0 0 42px;
  width:42px;
  height:42px;
  padding:0;
  margin:0;
  overflow:hidden;
}
.query-page .query-message-avatar .img,
.query-page .query-message-avatar span {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  margin:0;
}
.query-page .query-message-content {
  display:flex;
  flex:1 1 auto;
  flex-direction:column;
  justify-content:center;
  min-width:0;
  min-height:42px;
}
.query-page .query-message-content .message {
  position:relative;
  display:block;
  width:100%;
  min-height:20px;
  padding:2px 0 3px;
  border:0;
  border-radius:0;
  background:transparent;
  text-align:left;
}
.query-page .query-message-content .message::after {
  content:'';
  position:absolute;
  right:0;
  bottom:0;
  left:0;
  height:1px;
  background:linear-gradient(90deg,rgba(150,197,246,.28),rgba(150,197,246,.035));
}
.query-page .query-message-content .messager-inner,
.query-page .query-message-content .lup-message-state { position:relative; z-index:1; }
.query-page .query-message-content .lup-message-state { right:auto; bottom:auto; left:auto; }
.query-page .lup-own-msg .query-message-card { flex-direction:row-reverse; }
.query-page .lup-own-msg .query-message-content { text-align:right; }
.query-page .lup-own-msg .query-message-content .message { text-align:right; }
.query-page .lup-own-msg .query-message-content .message::after { background:linear-gradient(90deg,rgba(150,197,246,.035),rgba(150,197,246,.28)); }

/* Inbox geometry: Angular Material's md-secondary used absolute positioning
   and the avatar directive kept a 32px inner image. Both are reset here. */
.notification .notification-panel .inbox-message-list .inbox-thread-card {
  display:flex;
  align-items:center;
  width:100%;
  margin:0;
  padding:10px 12px;
}
.notification .notification-panel .inbox-thread-avatar {
  display:block;
  flex:0 0 42px;
  align-self:center;
  width:42px;
  height:42px;
  margin:0 12px 0 0;
  padding:0;
}
.notification .notification-panel .inbox-thread-avatar .lup-avatar {
  display:block;
  width:42px;
  height:42px;
  margin:0;
  padding:0;
  overflow:hidden;
}
.notification .notification-panel .inbox-thread-avatar .lup-avatar .img,
.notification .notification-panel .inbox-thread-avatar .lup-avatar span {
  top:0;
  left:0;
  width:100%;
  height:100%;
  margin:0;
}
.notification .notification-panel .inbox-thread-copy { min-width:0; }
.notification .notification-panel .inbox-thread-open.md-secondary,
.notification .notification-panel .inbox-thread-open {
  position:static;
  right:auto;
  margin:0 0 0 auto;
}

/* Exact alignment for direct messages. The avatar directive renders a nested
   .img layer, so it must be sized explicitly instead of inheriting the old
   32px avatar inset. This keeps the picture geometrically centred. */
.query-page .query-message-avatar {
  flex:0 0 42px;
  width:42px;
  height:42px;
  padding:0;
  line-height:0;
}
.query-page .query-message-avatar .img,
.query-page .query-message-avatar span {
  top:0;
  left:0;
  width:100%;
  height:100%;
  margin:0;
}
.query-page .query-message-content {
  display:flex;
  flex:1 1 auto;
  flex-direction:column;
  justify-content:center;
  min-height:42px;
}
.query-page .query-message-content .message {
  position:relative;
  display:block;
  min-height:18px;
  padding:1px 0 2px;
  text-align:left;
}
.query-page .query-message-content .message::after {
  content:'';
  position:absolute;
  z-index:0;
  right:0;
  bottom:0;
  left:0;
  height:1px;
  background:linear-gradient(90deg,rgba(150,197,246,.23),rgba(150,197,246,.045));
}
.query-page .query-message-content .messager-inner,
.query-page .query-message-content .lup-message-state { position:relative; z-index:1; }
.query-page .query-message-content .lup-message-state {
  position:relative;
  right:auto;
  bottom:auto;
  left:auto;
  display:inline-block;
  width:auto;
  height:auto;
  margin-left:6px;
}
.query-page .lup-own-msg .query-message-content .message { text-align:right; }
.query-page .lup-own-msg .query-message-content .message::after { background:linear-gradient(90deg,rgba(150,197,246,.045),rgba(150,197,246,.23)); }
@media (max-width:360px) {
  .query-page .query-message-avatar { flex-basis:38px; width:38px; height:38px; }
}

/* Inbox final geometry: let a message row reach the right content edge and
   centre its avatar in the actual row, independent of earlier legacy rules. */
.notification .notification-panel .inbox-message-list .inbox-thread-card {
  margin-right:0;
  margin-left:12px;
  padding-right:12px;
  padding-left:3px;
}
.notification .inbox-thread-avatar {
  align-self:center;
  width:42px;
  height:42px;
  margin:0 11px 0 8px;
}
.notification .inbox-thread-avatar .lup-avatar,
.notification .inbox-thread-avatar .lup-avatar img {
  display:block;
  width:42px;
  height:42px;
  margin:0;
  transform:none;
}
.notification .inbox-thread-avatar .lup-avatar {
  border:1px solid rgba(180,215,246,.28);
  outline:0;
  box-shadow:0 4px 12px rgba(2,10,29,.16);
}
@media (max-width:360px) {
  .notification .notification-panel .inbox-message-list .inbox-thread-card { margin-left:8px; margin-right:0; padding-right:9px; }
  .notification .inbox-thread-avatar,.notification .inbox-thread-avatar .lup-avatar,.notification .inbox-thread-avatar .lup-avatar img { width:38px; height:38px; }
}

/* Profile settings are a personal control panel, not a raw list of backend
   modules.  One quiet ambient field stays visible through every transparent
   surface; the icons only orient the user and never compete with a control. */
.settings-page > md-content {
  position:relative;
  isolation:isolate;
  overflow-x:hidden;
  background:
    radial-gradient(ellipse 72% 28% at 102% 8%,rgba(111,175,245,.16),transparent 70%),
    radial-gradient(ellipse 58% 22% at -8% 42%,rgba(145,104,225,.11),transparent 72%),
    linear-gradient(155deg,#151a2a 0%,#0d1322 56%,#101629 100%);
}
.settings-page > md-content::before {
  content:'';
  position:absolute;
  z-index:-1;
  inset:0;
  pointer-events:none;
  opacity:.52;
  background:
    radial-gradient(circle at 15% 18%,rgba(180,223,255,.30) 0 1px,transparent 1.6px),
    radial-gradient(circle at 76% 31%,rgba(190,161,255,.24) 0 1px,transparent 1.7px),
    linear-gradient(119deg,transparent 0 30%,rgba(128,192,255,.08) 30.1% 30.25%,transparent 30.35% 100%);
  background-size:137px 149px,181px 203px,100% 100%;
}
.settings-page .lup-settings-list {
  max-width:740px;
  padding:16px 14px 36px;
  background:transparent;
}
.settings-page .lup-settings-profile-visibility {
  position:relative;
  margin:0 0 20px;
}
.settings-page .lup-settings-profile-divider { display:none; }
.settings-page .lup-settings-group { position:relative; margin:0 0 25px; }
.settings-page .lup-settings-group::before {
  content:'';
  position:absolute;
  top:25px;
  bottom:-16px;
  left:23px;
  width:1px;
  background:linear-gradient(to bottom,rgba(163,210,255,.34),rgba(163,210,255,.06));
  pointer-events:none;
}
.settings-page .lup-settings-group:last-child::before { bottom:18px; }
.settings-page .lup-settings-group-heading {
  display:flex;
  align-items:center;
  gap:10px;
  min-height:39px;
  margin:0 2px 8px;
}
.settings-page .lup-settings-group-heading .md-subheader {
  display:block;
  min-height:0;
  margin:0;
  padding:0;
  color:#d8e7fa;
  font-size:10px;
  font-weight:820;
  letter-spacing:.14em;
  line-height:1.2;
  text-transform:uppercase;
}
.settings-page .settings-group-mark,
.settings-page .settings-field-mark {
  display:grid;
  flex:0 0 auto;
  place-items:center;
  width:36px;
  height:36px;
  border:1px solid rgba(181,215,255,.24);
  border-radius:13px 13px 13px 5px;
  background:linear-gradient(145deg,rgba(157,206,255,.16),rgba(111,91,201,.09));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 7px 14px rgba(1,8,25,.13);
  color:#bce4ff;
}
.settings-page .settings-group-mark .material-icons { font-size:19px; }
.settings-page .settings-field-mark {
  width:31px;
  height:31px;
  margin-right:11px;
  border-radius:10px 10px 10px 4px;
  border-color:rgba(183,213,255,.16);
  background:rgba(129,171,226,.08);
  box-shadow:none;
  color:#a4cbe9;
}
.settings-page .settings-field-mark .material-icons { font-size:16px; }
.settings-page .settings-field-mark-quiet { opacity:.88; }
.settings-page .settings-group-time .settings-group-mark { color:#cad0ff; border-color:rgba(194,192,255,.29); }
.settings-page .settings-group-social .settings-group-mark { color:#b7e8df; border-color:rgba(160,229,211,.25); }
.settings-page .settings-group-local .settings-group-mark { color:#b9dcff; border-color:rgba(156,205,255,.28); }
.settings-page .lup-settings-list md-list-item.md-2-line {
  min-height:72px;
  margin:7px 0 7px 47px;
  padding:8px 13px 8px 10px;
  border:1px solid rgba(197,221,255,.115);
  border-radius:16px 16px 16px 7px;
  background:linear-gradient(118deg,rgba(143,182,226,.095),rgba(255,255,255,.025) 68%,rgba(126,100,204,.055));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 9px 20px rgba(1,8,24,.11);
}
.settings-page .lup-settings-profile-visibility md-list-item.md-2-line { margin-left:0; }
.settings-page .lup-settings-list md-list-item.md-2-line:hover {
  transform:translateY(-1px);
  border-color:rgba(172,213,255,.34);
  background:linear-gradient(118deg,rgba(116,176,232,.16),rgba(143,109,222,.09) 72%);
}
.settings-page .lup-settings-list .md-list-item-text { min-width:0; }
.settings-page .lup-settings-list .md-list-item-text h3 {
  overflow:hidden;
  color:#f2f7ff;
  font-size:13px;
  font-weight:720;
  line-height:1.22;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.settings-page .lup-settings-list .lup-setting-controls { gap:7px; margin-left:7px; }
.settings-page .lup-settings-list md-select {
  min-width:116px;
  border-color:rgba(183,215,255,.22);
  border-radius:10px;
  background:rgba(9,16,30,.42);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
@media (max-width:420px) {
  .settings-page .lup-settings-list { padding:13px 11px 30px; }
  .settings-page .lup-settings-group { margin-bottom:21px; }
  .settings-page .lup-settings-group::before { left:19px; }
  .settings-page .settings-group-mark { width:32px; height:32px; border-radius:11px 11px 11px 4px; }
  .settings-page .settings-group-mark .material-icons { font-size:17px; }
  .settings-page .lup-settings-list md-list-item.md-2-line { min-height:67px; margin-left:38px; padding-right:8px; padding-left:8px; }
  .settings-page .lup-settings-profile-visibility md-list-item.md-2-line { margin-left:0; }
  .settings-page .settings-field-mark { width:27px; height:27px; margin-right:7px; }
  .settings-page .settings-field-mark .material-icons { font-size:14px; }
  .settings-page .lup-settings-list .md-list-item-text h3 { font-size:12px; }
  .settings-page .lup-settings-list md-select { min-width:94px; max-width:42vw; }
}
@media (prefers-reduced-motion:reduce) { .settings-page .lup-settings-list md-list-item.md-2-line { transition:none; } }

/* Password recovery follows the same calm arrival route as login and
   registration, with security information kept clear instead of technical. */
.recovery-page .auth-canvas::before { background:radial-gradient(ellipse 53% 38% at 19% 18%,rgba(75,160,221,.19),transparent 73%),radial-gradient(ellipse 42% 38% at 81% 69%,rgba(113,86,196,.16),transparent 73%),linear-gradient(155deg,#111b2d 0%,#0b1020 58%,#0b0f1c 100%); }
.recovery-ambient-route { position:absolute; z-index:0; inset:0; width:100%; height:100%; pointer-events:none; opacity:.59; animation:recovery-route-drift 21s ease-in-out infinite alternate; }
.recovery-ambient-base { fill:none; stroke:rgba(156,214,248,.19); stroke-width:1.15; vector-effect:non-scaling-stroke; }
.recovery-ambient-base-lower { stroke:rgba(175,147,242,.16); }
.recovery-ambient-point { fill:#dff7ff; stroke:#99d6f2; stroke-width:2; vector-effect:non-scaling-stroke; filter:drop-shadow(0 0 6px rgba(121,211,255,.72)); animation:recovery-point-pulse 5.8s ease-in-out infinite; }
.recovery-ambient-point-late { animation-delay:2.9s; }
.recovery-page .auth-panel.recovery-panel { border:1px solid rgba(192,221,252,.13); background:linear-gradient(145deg,rgba(26,35,57,.76),rgba(12,18,32,.76)); box-shadow:0 26px 64px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.08); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
.recovery-page .recovery-mail-note { display:flex; gap:9px; align-items:flex-start; margin:0 0 16px; padding:10px 11px; border-left:2px solid rgba(149,211,247,.64); border-radius:0 11px 11px 0; background:rgba(125,171,216,.08); color:#b9cce0; font-size:11px; line-height:1.4; }
.recovery-page .recovery-mail-note .material-icons { flex:0 0 auto; color:#bde7fb; font-size:17px; }
.recovery-page md-input-container.recovery-captcha-image { display:flex; align-items:center; min-height:60px; height:60px; margin:1px 0 15px; padding:5px; border:1px solid rgba(170,208,242,.18); border-radius:13px; background:linear-gradient(120deg,rgba(116,169,215,.11),rgba(255,255,255,.025)); box-shadow:inset 0 1px 0 rgba(255,255,255,.07); }
.recovery-page md-input-container.recovery-captcha-image::before { content:'SICHERHEITSCODE'; align-self:stretch; display:flex; align-items:center; padding:0 9px 0 4px; color:#9dbad4; font-size:8px; font-weight:850; letter-spacing:.11em; }
.recovery-page md-input-container.recovery-captcha-image img { display:block; width:256px; max-width:calc(100% - 97px); height:48px; margin:0; border:0; border-radius:8px; background:#f7fbff; object-fit:contain; box-shadow:0 4px 10px rgba(2,8,20,.19); }
.recovery-page .recovery-submit .login-button { display:flex; align-items:center; justify-content:center; gap:8px; min-height:48px; height:48px; border:1px solid rgba(214,238,255,.34); border-radius:14px; background:linear-gradient(108deg,#5b84df 0%,#368fdf 52%,#55b8ef 100%); box-shadow:inset 0 1px 0 rgba(255,255,255,.34),0 12px 24px rgba(35,112,205,.22); }
.recovery-page .recovery-submit .login-button .material-icons { font-size:18px; }
.recovery-page .recovery-return .backtologin { display:flex; align-items:center; justify-content:center; gap:7px; line-height:42px; }
.recovery-page .recovery-return .backtologin span { display:block; line-height:1; }
.recovery-page .recovery-return .backtologin .material-icons { font-size:16px; line-height:1; }
.recovery-page .recovery-submit,.recovery-page .recovery-return { display:block; width:100%; }
.recovery-page .recovery-return .backtologin { width:100%; min-height:42px; height:42px; margin:8px 0 0; border:1px solid rgba(184,213,243,.14); border-radius:12px; background:rgba(255,255,255,.025); box-shadow:none; color:#bcd0e3; font-size:11px; font-weight:720; text-transform:none; }
.recovery-page .recovery-return .backtologin:hover { color:#edf7ff; background:rgba(137,186,231,.09); }
.recovery-page .recovery-security-note { display:flex; align-items:flex-start; gap:6px; margin:13px 1px 0; color:#8fa5ba; font-size:9px; line-height:1.38; }
.recovery-page .recovery-security-note .material-icons { flex:0 0 auto; margin-top:-1px; color:#9bc9e8; font-size:14px; }
@keyframes recovery-route-drift { from { transform:translate3d(-.65%,-.25%,0); opacity:.43; } to { transform:translate3d(.65%,.25%,0); opacity:.62; } }
@keyframes recovery-point-pulse { 0%,100% { opacity:.38; transform:scale(.72); } 47% { opacity:1; transform:scale(1.24); } }
@media (max-width:600px) { .recovery-page .auth-panel.recovery-panel { margin-top:14px; }.recovery-ambient-route { opacity:.53; }.recovery-page .recovery-mail-note { margin-bottom:13px; font-size:10px; } }
@media (prefers-reduced-motion:reduce) { .recovery-ambient-route,.recovery-ambient-point { animation:none; } }

/* Legal information should read like a calm document, never like a raw server
   page. The incoming legal HTML stays untouched; only its presentation and
   accidental development panels are contained here. */
.lup-legal-dialog { width:min(92vw,720px); max-height:min(84vh,780px); overflow:hidden; border:1px solid rgba(180,213,247,.18); border-radius:22px; background:linear-gradient(155deg,#172239,#0e1525 76%); box-shadow:0 28px 78px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.08); color:#eaf1fb; }
.lup-legal-dialog md-toolbar,.lup-legal-dialog md-toolbar .md-toolbar-tools { min-height:71px; height:71px; padding:0 15px; background:linear-gradient(105deg,rgba(88,143,202,.19),rgba(93,77,166,.14),rgba(10,16,30,.08)); }
.lup-legal-dialog md-toolbar { border-bottom:1px solid rgba(181,214,246,.13); }
.lup-legal-dialog .legal-dialog-mark { display:grid; place-items:center; flex:0 0 auto; width:36px; height:36px; margin-right:10px; border:1px solid rgba(183,223,252,.25); border-radius:12px 12px 12px 4px; background:linear-gradient(145deg,rgba(96,165,222,.34),rgba(109,89,190,.24)); box-shadow:inset 0 1px 0 rgba(255,255,255,.23),0 7px 16px rgba(0,0,0,.16); color:#dcf4ff; }
.lup-legal-dialog .legal-dialog-mark .material-icons { font-size:20px; }
.lup-legal-dialog .legal-dialog-heading { display:flex; min-width:0; flex-direction:column; justify-content:center; }
.lup-legal-dialog .legal-dialog-heading small { margin-bottom:3px; color:#9ec8e6; font-size:8px; font-weight:850; letter-spacing:.14em; line-height:1; }
.lup-legal-dialog .legal-dialog-heading h2 { margin:0; overflow:hidden; color:#f3f7ff; font-size:19px; font-weight:720; letter-spacing:-.025em; line-height:1.05; text-overflow:ellipsis; white-space:nowrap; }
.lup-legal-dialog .legal-dialog-close { display:grid; place-items:center; width:34px; min-width:34px; height:34px; min-height:34px; margin:0; border:1px solid rgba(189,220,247,.14); border-radius:11px; background:rgba(5,12,25,.28); color:#c7d9e8; }
.lup-legal-dialog .legal-dialog-close .material-icons { font-size:18px; }
.lup-legal-dialog md-dialog-content { max-height:calc(min(84vh,780px) - 71px); background:transparent; }
.lup-legal-dialog .legal-dialog-document { padding:25px clamp(20px,4vw,38px) 34px; color:#c7d4e2; font-size:13px; line-height:1.65; }
.lup-legal-dialog .legal-dialog-document > .lup-legal-return,.lup-legal-dialog .legal-dialog-document > h1 { display:none; }
.lup-legal-dialog .legal-dialog-document h2 { position:relative; margin:27px 0 9px; padding-top:14px; border-top:1px solid rgba(192,217,242,.12); color:#eef6ff; font-size:16px; font-weight:760; letter-spacing:-.015em; line-height:1.25; }
.lup-legal-dialog .legal-dialog-document h2:first-of-type { margin-top:4px; }
.lup-legal-dialog .legal-dialog-document h2::before { content:''; position:absolute; top:-1px; left:0; width:42px; height:1px; background:linear-gradient(90deg,#9bd9ff,rgba(148,127,235,.45),transparent); }
.lup-legal-dialog .legal-dialog-document p { margin:0 0 14px; }
.lup-legal-dialog .legal-dialog-document strong { color:#edf5ff; font-weight:760; }
.lup-legal-dialog .legal-dialog-document a { color:#a9dcfa; font-weight:700; text-decoration:none; text-underline-offset:3px; }
.lup-legal-dialog .legal-dialog-document a:hover { color:#e3f5ff; text-decoration:underline; }
.lup-legal-dialog .legal-dialog-document ul { margin:2px 0 17px; padding-left:19px; }
.lup-legal-dialog .legal-dialog-document li { margin:7px 0; padding-left:2px; }
.lup-legal-dialog .legal-dialog-document small { color:#93a7bc; font-size:10px; line-height:1.45; }
/* These panels are emitted by the local development backend after privacy
   text. They contain configuration internals, not legal information. */
.lup-legal-dialog .legal-dialog-document > .gdt-panel { display:none; }
@media (max-width:520px) { .lup-legal-dialog { width:calc(100vw - 20px); max-height:88vh; border-radius:18px; }.lup-legal-dialog md-toolbar,.lup-legal-dialog md-toolbar .md-toolbar-tools { min-height:62px; height:62px; padding:0 11px; }.lup-legal-dialog .legal-dialog-mark { width:32px; height:32px; margin-right:8px; border-radius:10px 10px 10px 3px; }.lup-legal-dialog .legal-dialog-heading h2 { font-size:17px; }.lup-legal-dialog md-dialog-content { max-height:calc(88vh - 62px); }.lup-legal-dialog .legal-dialog-document { padding:20px 17px 28px; font-size:12px; line-height:1.58; }.lup-legal-dialog .legal-dialog-document h2 { margin-top:23px; font-size:15px; } }

/* Legal dialog: keep the close control pinned to the dialog, not to Angular
   Material's dynamically sized toolbar row. */
.lup-legal-dialog { position:relative; isolation:isolate; background:linear-gradient(155deg,#172239,#0e1525 76%); }
.lup-legal-dialog md-toolbar .md-toolbar-tools { position:relative; padding-right:58px; }
.lup-legal-dialog .legal-dialog-close {
	position:absolute;
	z-index:5;
	top:50%; right:15px;
	margin:0;
	transform:translateY(-50%);
}
.lup-legal-dialog md-dialog-content { position:relative; z-index:1; background:linear-gradient(180deg,rgba(10,16,29,.42),rgba(10,16,29,.08)); }
@media (max-width:520px) {
	.lup-legal-dialog md-toolbar .md-toolbar-tools { padding-right:52px; }
	.lup-legal-dialog .legal-dialog-close { right:11px; }
}

/* The legal template contains a second md-dialog-content wrapper.  Reset the
   outer Material padding so the actual document stays centered instead of
   being pushed sideways by two nested content gutters. */
.lup-legal-dialog > form > md-dialog-content {
	margin:0;
	padding:0;
	width:100%;
	box-sizing:border-box;
}
.lup-legal-dialog .legal-dialog-document {
	display:block;
	width:100%;
	max-width:none;
	margin:0 auto;
	box-sizing:border-box;
}

/* Profile facts are supporting information. Keep them compact so the person,
   rather than a wall of glowing cards, remains the focus of “Über mich”. */
.profile-page .profile-information.profile-settings-view { width:min(100%,680px); padding:6px 16px 24px; }
.profile-page .profile-information.profile-settings-view .profile-settings-group { gap:6px 8px; margin-bottom:15px; }
.profile-page .profile-information.profile-settings-view .profile-settings-group > .md-subheader { min-height:20px; padding:2px 1px 5px; color:#9dadbf; font-size:7px; }
.profile-page .profile-information.profile-settings-view .profile-detail-card { grid-template-columns:32px minmax(0,1fr); gap:8px; min-height:60px; padding:7px 8px; border-color:rgba(195,213,239,.065); border-radius:10px; background:rgba(31,40,61,.18); box-shadow:none; }
.profile-page .profile-information.profile-settings-view .profile-detail-card:nth-of-type(3n) { background:rgba(45,58,86,.20); }
.profile-page .profile-information.profile-settings-view .profile-detail-card .profile-detail-icon { width:32px; height:32px; border:1px solid rgba(174,220,255,.12); border-radius:10px 10px 10px 4px; background:rgba(99,169,228,.07); color:#b9e5ff; }
.profile-page .profile-information.profile-settings-view .profile-detail-card .profile-detail-icon .material-icons { font-size:18px; }
.profile-page .profile-information.profile-settings-view .profile-detail-card h3 { margin-bottom:2px; color:#8fa4bb; font-size:7px; letter-spacing:.06em; }
.profile-page .profile-information.profile-settings-view .profile-detail-card p { font-size:11px; font-weight:590; line-height:1.25; }
.profile-page .profile-information.profile-settings-view .profile-detail-card:hover { transform:none; border-color:rgba(170,220,255,.15); background:rgba(62,82,111,.27); box-shadow:inset 0 1px 0 rgba(255,255,255,.05); }
@media (max-width:360px) { .profile-page .profile-information.profile-settings-view { padding-right:11px; padding-left:11px; }.profile-page .profile-information.profile-settings-view .profile-settings-group { gap:5px 6px; }.profile-page .profile-information.profile-settings-view .profile-detail-card { grid-template-columns:29px minmax(0,1fr); gap:6px; min-height:57px; padding:7px; }.profile-page .profile-information.profile-settings-view .profile-detail-card .profile-detail-icon { width:29px; height:29px; }.profile-page .profile-information.profile-settings-view .profile-detail-card .profile-detail-icon .material-icons { font-size:16px; }.profile-page .profile-information.profile-settings-view .profile-detail-card p { font-size:10px; } }

/* Settings refinement: words must carry the meaning.  The prior icon system
   made ordinary choices look like an unexplained control board. */
.settings-page > md-content {
  background:
    radial-gradient(ellipse 70% 25% at 102% 5%,rgba(131,168,221,.09),transparent 70%),
    radial-gradient(ellipse 55% 20% at -7% 47%,rgba(145,119,201,.06),transparent 72%),
    linear-gradient(155deg,#151925 0%,#0d1220 58%,#101522 100%);
}
.settings-page > md-content::before { opacity:.24; }
.settings-page .lup-settings-group { margin-bottom:22px; }
.settings-page .lup-settings-group::before {
  top:25px;
  bottom:-14px;
  left:5px;
  background:linear-gradient(to bottom,rgba(180,210,246,.26),rgba(180,210,246,.035));
}
.settings-page .lup-settings-group-heading {
  min-height:31px;
  margin:0 4px 7px;
  padding-left:13px;
  border-left:2px solid rgba(176,209,247,.50);
}
.settings-page .lup-settings-group-heading .md-subheader {
  color:#dce7f5;
  font-size:10px;
  letter-spacing:.11em;
}
.settings-page .settings-group-mark,
.settings-page .settings-field-mark { display:none; }
.settings-page .lup-settings-list md-list-item.md-2-line,
.settings-page .lup-settings-profile-visibility md-list-item.md-2-line {
  min-height:68px;
  margin:6px 0;
  padding:8px 12px;
  border-color:rgba(197,216,241,.11);
  border-radius:14px 14px 14px 6px;
  background:linear-gradient(110deg,rgba(198,216,241,.045),rgba(255,255,255,.016) 70%,rgba(151,136,205,.032));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 8px 18px rgba(1,8,24,.10);
}
.settings-page .lup-settings-list md-list-item.md-2-line:hover {
  border-color:rgba(180,210,246,.26);
  background:linear-gradient(110deg,rgba(143,186,230,.10),rgba(151,136,205,.06));
}
.settings-page .lup-settings-list md-select,
.settings-page .lup-settings-list .lup-setting-input input,
.settings-page .lup-settings-list .lup-setting-input textarea {
  color:#eef4fb;
  -webkit-text-fill-color:#eef4fb;
  border-color:rgba(188,211,240,.18);
  background:rgba(8,14,25,.26);
  box-shadow:none;
}
.settings-page .lup-settings-list md-select .md-select-value,
.settings-page .lup-settings-list md-select .md-select-value span,
.settings-page .lup-settings-list .md-select-value,
.settings-page .lup-settings-list .md-select-value span {
  color:#eef4fb;
  border-bottom-color:rgba(188,211,240,.28);
  background:transparent;
}
.md-select-menu-container .md-select-menu,
.md-select-menu-container md-content,
.md-select-menu-container .md-select-menu md-content {
  color:#edf4ff;
  background:#121a2a;
  border-color:rgba(187,211,243,.18);
}
.md-select-menu-container md-option,
.md-select-menu-container md-option .md-text {
  color:#e8f0fb;
  background:transparent;
}
.md-select-menu-container md-option:hover,
.md-select-menu-container md-option:focus,
.md-select-menu-container md-option.md-selected {
  color:#fff;
  background:rgba(126,160,213,.18);
}
@media (max-width:420px) {
  .settings-page .lup-settings-list md-list-item.md-2-line,
  .settings-page .lup-settings-profile-visibility md-list-item.md-2-line { margin-left:0; padding-right:9px; padding-left:9px; }
}

/* Native Material controls are appended late by Angular.  Keep every variant
   inside the same transparent LinkUUp surface instead of falling back to the
   browser's white form styling. */
.settings-page .lup-settings-list md-select,
.settings-page .lup-settings-list md-select .md-select-value,
.settings-page .lup-settings-list md-input-container,
.settings-page .lup-settings-list md-input-container .md-input,
.settings-page .lup-settings-list .lup-setting-input input,
.settings-page .lup-settings-list .lup-setting-input textarea {
  background:rgba(8,14,25,.30);
  color:#edf4ff;
  -webkit-text-fill-color:#edf4ff;
}
.settings-page .lup-settings-list .lup-setting-input input[type="color"] {
  appearance:none;
  -webkit-appearance:none;
  padding:3px;
  border:1px solid rgba(188,211,240,.20);
  background:rgba(8,14,25,.30);
}
.settings-page .lup-settings-list .lup-setting-input input[type="color"]::-webkit-color-swatch-wrapper { padding:0; }
.settings-page .lup-settings-list .lup-setting-input input[type="color"]::-webkit-color-swatch { border:0; border-radius:7px; }
.settings-page .lup-settings-list md-select .md-select-value,
.settings-page .lup-settings-list md-select .md-select-value span {
  border-bottom-color:rgba(188,211,240,.24);
  background:transparent;
}
.settings-page .lup-settings-list .md-select-icon { color:#9fc9e8; }
.md-select-menu-container,
.md-select-menu-container .md-select-menu,
.md-select-menu-container md-content,
.md-select-menu-container .md-select-menu md-content {
  background:#111a29;
  box-shadow:0 14px 32px rgba(0,0,0,.36);
}

/* Public “About me” values use the profile's ambient field.  The original
   page stylesheet still styled unclassified list items as white cards; give
   the renderer its explicit card class and neutralise that legacy fallback. */
.profile-page .profile-information.profile-settings-view {
  position:relative;
  width:min(100%,720px);
  display:block;
  box-sizing:border-box;
  margin:0 auto;
  padding:3px 18px 30px;
  background:transparent;
}
.profile-page .profile-information.profile-settings-view .profile-settings-group { margin:0 0 19px; }
.profile-page .profile-information.profile-settings-view .md-subheader {
  min-height:25px;
  margin:0 0 7px;
  padding:0 0 0 10px;
  border-left:2px solid rgba(167,209,244,.45);
  background:transparent;
  color:#bccfe3;
  font-size:9px;
  font-weight:780;
  letter-spacing:.12em;
  line-height:25px;
  text-transform:uppercase;
}
.profile-page .profile-information.profile-settings-view .profile-detail-card,
.profile-page .profile-information.profile-settings-view .profile-detail-card .md-list-item-text {
  min-height:0;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.profile-page .profile-information.profile-settings-view .profile-detail-card {
  position:relative;
  display:block;
  margin:6px 0;
  padding:12px 14px 11px;
  overflow:hidden;
  border:1px solid rgba(195,218,245,.11);
  border-radius:14px 14px 14px 6px;
  background:linear-gradient(112deg,rgba(142,177,219,.075),rgba(255,255,255,.018) 74%,rgba(135,112,197,.040));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 8px 17px rgba(0,0,0,.10);
}
.profile-page .profile-information.profile-settings-view .profile-detail-card h3 {
  display:flex;
  align-items:center;
  gap:5px;
  margin:0 0 5px;
  color:#dce8f6;
  font-size:10px;
  font-weight:760;
  letter-spacing:.06em;
  line-height:1.25;
  text-transform:uppercase;
}
.profile-page .profile-information.profile-settings-view .profile-detail-card p {
  margin:0;
  color:#f1f5fa;
  font-size:14px;
  font-weight:500;
  line-height:1.38;
  word-break:break-word;
}
.profile-page .profile-information.profile-settings-view .profile-detail-card .profile-setting-acl { color:#9ed6ff; font-size:14px; }
.profile-page .profile-information.profile-settings-view .profile-detail-card.profile-setting-denied { border-color:rgba(221,165,177,.16); background:rgba(109,54,70,.10); }
@media (max-width:420px) { .profile-page .profile-information.profile-settings-view { padding-right:12px; padding-left:12px; }.profile-page .profile-information.profile-settings-view .profile-detail-card { padding:11px 12px; } }

/* The public profile reads as compact facts: a label and its value belong in
   one tile.  The responsive grid prevents a long, unstructured column while
   still returning to one column before content would become cramped. */
.profile-page .profile-information.profile-settings-view .profile-settings-group {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin:0 0 22px;
}
.profile-page .profile-information.profile-settings-view .profile-settings-group > .md-subheader {
  grid-column:1 / -1;
  margin-bottom:0;
}
.profile-page .profile-information.profile-settings-view .profile-detail-card {
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:92px;
  margin:0;
  padding:13px 14px 12px;
}
.profile-page .profile-information.profile-settings-view .profile-detail-card h3 {
  min-height:25px;
  margin-bottom:7px;
  color:#b8cbe1;
  font-size:10px;
  line-height:1.28;
}
.profile-page .profile-information.profile-settings-view .profile-detail-card p {
  color:#f2f6fb;
  font-size:14px;
  font-weight:600;
  line-height:1.32;
}
@media (min-width:680px) {
  .profile-page .profile-information.profile-settings-view { width:min(100%,900px); }
  .profile-page .profile-information.profile-settings-view .profile-settings-group { grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
  .profile-page .profile-information.profile-settings-view .profile-detail-card { min-height:100px; }
}
@media (max-width:379px) {
  .profile-page .profile-information.profile-settings-view .profile-settings-group { grid-template-columns:1fr; }
  .profile-page .profile-information.profile-settings-view .profile-detail-card { min-height:76px; }
}

/* Profile facts are an easy-to-scan record, not a wall of miniature cards.
   Each row answers one question: label on the left, the actual answer on the
   right. The ambient profile map stays visible between the fine dividers. */
.profile-page .profile-information.profile-settings-view {
  width:min(100%,620px);
  padding:5px 20px 28px;
}
.profile-page .profile-information.profile-settings-view .profile-settings-group {
  display:block;
  margin:0 0 18px;
  border-top:1px solid rgba(203,218,240,.10);
}
.profile-page .profile-information.profile-settings-view .profile-settings-group > .md-subheader {
  min-height:auto;
  margin:0;
  padding:12px 0 7px;
  border:0;
  color:#aebbd0;
  font-size:9px;
  font-weight:800;
  letter-spacing:.13em;
  line-height:1.2;
}
.profile-page .profile-information.profile-settings-view .profile-detail-card {
  display:grid;
  grid-template-columns:minmax(0,42%) minmax(0,58%);
  align-items:center;
  min-height:0;
  margin:0;
  padding:11px 0;
  border:0;
  border-bottom:1px solid rgba(203,218,240,.075);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.profile-page .profile-information.profile-settings-view .profile-detail-card::after { display:none; }
.profile-page .profile-information.profile-settings-view .profile-detail-card h3 {
  min-height:0;
  margin:0;
  padding:0 12px 0 0;
  color:#aebbd0;
  font-size:11px;
  font-weight:680;
  letter-spacing:.01em;
  line-height:1.38;
  text-transform:none;
}
.profile-page .profile-information.profile-settings-view .profile-detail-card h3::after { display:none; }
.profile-page .profile-information.profile-settings-view .profile-detail-card p {
  min-width:0;
  margin:0;
  color:#edf2f9;
  font-size:clamp(13px,3.55vw,14px);
  font-weight:680;
  line-height:1.42;
  text-align:right;
  text-shadow:none;
  overflow-wrap:anywhere;
}
.profile-page .profile-information.profile-settings-view .profile-detail-card.profile-setting-denied { background:transparent; border-bottom-color:rgba(236,150,174,.13); }
@media (max-width:360px) {
  .profile-page .profile-information.profile-settings-view { padding-right:14px; padding-left:14px; }
  .profile-page .profile-information.profile-settings-view .profile-detail-card { grid-template-columns:minmax(0,45%) minmax(0,55%); }
  .profile-page .profile-information.profile-settings-view .profile-detail-card h3 { font-size:10px; }
  .profile-page .profile-information.profile-settings-view .profile-detail-card p { font-size:12px; }
}

/* Keep the profile's ambient field continuous behind the final fact groups. */
.profile-page .user-profile-page {
  background:
    radial-gradient(ellipse 75% 30% at 110% 68%,rgba(108,170,235,.09),transparent 72%),
    radial-gradient(ellipse 64% 24% at -9% 88%,rgba(140,105,207,.08),transparent 72%),
    var(--lup-bg);
}

/* Keep the public facts directly connected to the story instead of leaving a
   dead band between both parts of “About me”. */
.profile-page .profile-information.profile-about-single { padding-bottom:5px; }
.profile-page .profile-information.profile-settings-view { margin-top:0; padding-top:0; }
.profile-page .profile-information.profile-settings-view .profile-settings-group:first-child { margin-top:0; }
.profile-page .profile-information.profile-settings-view .profile-detail-card h3 {
  min-width:0;
  padding-right:2px;
}
.profile-page .profile-information.profile-settings-view .profile-setting-acl {
  position:static;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 18px;
  width:18px;
  min-width:18px;
  height:18px;
  margin-left:auto;
  line-height:18px;
  overflow:visible;
  transform:none;
  vertical-align:middle;
}

/* Inbox refinement: one conversation is one calm line.  The former stacked
   card, avatar ring and action frame competed with the actual message. */
.notification .notification-panel .inbox-message-list .inbox-thread-card {
  min-height:66px;
  margin:0 14px;
  padding:10px 6px 10px 3px;
  border:0;
  border-bottom:1px solid rgba(192,214,242,.10);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.notification .notification-panel .inbox-message-list .inbox-thread-card:first-child { border-top:1px solid rgba(192,214,242,.07); }
.notification .notification-panel .inbox-message-list .inbox-thread-card::before {
  top:50%;
  bottom:auto;
  left:0;
  width:3px;
  height:18px;
  border-radius:0 3px 3px 0;
  background:transparent;
  transform:translateY(-50%);
}
.notification .notification-panel .inbox-message-list .inbox-thread-card:hover,
.notification .notification-panel .inbox-message-list .inbox-thread-card:focus-within {
  transform:none;
  border-bottom-color:rgba(176,211,245,.20);
  background:linear-gradient(90deg,rgba(115,158,214,.075),transparent 72%);
  box-shadow:none;
}
.notification .inbox-thread-avatar {
  width:42px;
  height:42px;
  margin:0 11px 0 9px;
}
.notification .inbox-thread-avatar .lup-avatar,
.notification .inbox-thread-avatar .lup-avatar img {
  width:42px;
  height:42px;
}
.notification .inbox-thread-avatar .lup-avatar {
  border:1px solid rgba(180,215,246,.28);
  border-radius:50%;
  outline:0;
  outline-offset:0;
  box-shadow:0 4px 12px rgba(2,10,29,.16);
}
.notification .inbox-thread-live { right:-1px; bottom:0; border-color:#111a29; }
.notification .inbox-thread-copy h4 { color:#edf4fb; font-size:13px; }
.notification .inbox-thread-copy p { color:#a9b7ca; }
.notification .inbox-thread-open {
  width:29px;
  height:29px;
  min-width:29px;
  margin-left:7px;
  border:0;
  border-radius:50%;
  background:transparent;
  box-shadow:none;
  color:#9bcbed;
}
.notification .inbox-thread-open:hover,.notification .inbox-thread-open:focus-visible { background:rgba(145,198,239,.10); filter:none; }
.notification .inbox-thread-open .material-icons { font-size:17px; }
@media (max-width:360px) {
  .notification .notification-panel .inbox-message-list .inbox-thread-card { margin-right:10px; margin-left:10px; }
  .notification .inbox-thread-avatar,.notification .inbox-thread-avatar .lup-avatar,.notification .inbox-thread-avatar .lup-avatar img { width:38px; height:38px; }
}

/* Sidebar finishing pass — this is the final cascade in the app stylesheet.
   The header uses LinkUUp night-blue rather than the old metallic black, and
   icons deliberately have no individual square containers. */
.md-sidenav-left,.md-sidenav-left md-content { background:radial-gradient(ellipse 92% 30% at 12% 0,rgba(66,157,229,.16),transparent 70%),radial-gradient(ellipse 68% 34% at 94% 37%,rgba(126,86,211,.14),transparent 72%),linear-gradient(162deg,#111c30 0%,#151a2d 51%,#0f1422 100%); }
.md-sidenav-left md-toolbar.sidenav-brand,.md-sidenav-left .sidenav-brand { min-height:82px; background:radial-gradient(circle at 88% 24%,rgba(99,189,247,.32),transparent 29%),linear-gradient(115deg,#32295d 0%,#1a3158 56%,#121d33 100%); border-bottom:1px solid rgba(184,219,255,.17); box-shadow:inset 0 -1px 0 rgba(255,255,255,.055),0 8px 19px rgba(4,9,22,.22); }
.md-sidenav-left .sidenav-brand .md-toolbar-tools { height:82px; background:transparent; }.md-sidenav-left .sidenav-brand h1 { color:#f7fbff; font-weight:760; letter-spacing:-.035em; }.md-sidenav-left .sidenav-brand span { color:#b7d6f0; }
.md-sidenav-left md-list-item .nav-icon,.md-sidenav-left md-list-item.nav-discover .nav-icon,.md-sidenav-left md-list-item.nav-profile .nav-icon,.md-sidenav-left md-list-item.nav-friends .nav-icon,.md-sidenav-left md-list-item.nav-settings .nav-icon,.md-sidenav-left md-list-item.nav-account .nav-icon,.md-sidenav-left md-list-item.nav-profile-settings .nav-icon,.md-sidenav-left md-list-item.nav-logout .nav-icon { width:24px; height:24px; margin-right:14px; border:0; border-radius:0; background:transparent; box-shadow:none; font-size:19px; }
.md-sidenav-left md-list-item:hover .nav-icon { transform:translateX(1px); background:transparent; box-shadow:none; }.md-sidenav-left md-list-item::before { background:transparent; }.md-sidenav-left md-list-item:hover { border-color:transparent; background:linear-gradient(90deg,rgba(84,157,223,.18),rgba(123,92,202,.07) 68%,transparent); }.md-sidenav-left md-list-item:hover::before { background:#9fddff; box-shadow:0 0 11px rgba(129,208,255,.62); }

/* Sidebar finishing pass — placed at the physical end to win against legacy
   Material toolbar styles.  The navigation uses colour, not boxed icons. */
.md-sidenav-left,
.md-sidenav-left md-content {
  background:radial-gradient(ellipse 92% 30% at 12% 0,rgba(66,157,229,.16),transparent 70%),radial-gradient(ellipse 68% 34% at 94% 37%,rgba(126,86,211,.14),transparent 72%),linear-gradient(162deg,#111c30 0%,#151a2d 51%,#0f1422 100%);
}
.md-sidenav-left md-toolbar.sidenav-brand,
.md-sidenav-left .sidenav-brand {
  min-height:82px;
  background:radial-gradient(circle at 88% 24%,rgba(99,189,247,.32),transparent 29%),linear-gradient(115deg,#32295d 0%,#1a3158 56%,#121d33 100%);
  border-bottom:1px solid rgba(184,219,255,.17);
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.055),0 8px 19px rgba(4,9,22,.22);
}
.md-sidenav-left .sidenav-brand .md-toolbar-tools { height:82px; }
.md-sidenav-left .sidenav-brand h1 { color:#f7fbff; font-weight:760; letter-spacing:-.035em; }
.md-sidenav-left .sidenav-brand span { color:#b7d6f0; }
.md-sidenav-left md-list-item .nav-icon,
.md-sidenav-left md-list-item.nav-discover .nav-icon,
.md-sidenav-left md-list-item.nav-profile .nav-icon,
.md-sidenav-left md-list-item.nav-friends .nav-icon,
.md-sidenav-left md-list-item.nav-settings .nav-icon,
.md-sidenav-left md-list-item.nav-account .nav-icon,
.md-sidenav-left md-list-item.nav-profile-settings .nav-icon,
.md-sidenav-left md-list-item.nav-logout .nav-icon {
  width:24px;
  height:24px;
  margin-right:14px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  font-size:19px;
}
.md-sidenav-left md-list-item:hover .nav-icon { transform:translateX(1px); background:transparent; box-shadow:none; }
.md-sidenav-left md-list-item::before { background:transparent; }
.md-sidenav-left md-list-item:hover { border-color:transparent; background:linear-gradient(90deg,rgba(84,157,223,.18),rgba(123,92,202,.07) 68%,transparent); }
.md-sidenav-left md-list-item:hover::before { background:#9fddff; box-shadow:0 0 11px rgba(129,208,255,.62); }

/* Final discovery controls: both bottom actions have the same touch target
   and weight; live presence is a small status rail, not a competing icon. */
.nearby .placeboard .distrat {
  right:22px;
  bottom:22px;
  left:22px;
  display:grid;
  grid-template-columns:64px 64px;
  justify-content:space-between;
  align-items:center;
  width:auto;
  height:64px;
  gap:0;
}
.nearby .placeboard .distrat .location-cuddles,
.nearby .placeboard .distrat .distance,
.nearby .placeboard .distrat .distance p,
.nearby .placeboard .distrat .distance a,
.nearby .placeboard .distrat .distance a > .material-icons {
  box-sizing:border-box;
  width:64px;
  min-width:64px;
  height:64px;
  margin:0;
  border-radius:16px;
  transform:none;
}
.nearby .placeboard .distrat .location-cuddles,
.nearby .placeboard .distrat .distance a > .material-icons {
  border:1px solid rgba(185,214,255,.24);
  background:linear-gradient(145deg,rgba(112,133,204,.22),rgba(30,38,65,.80));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 8px 17px rgba(0,0,0,.17);
}
.nearby .placeboard .distrat .distance a { display:block; background:transparent; box-shadow:none; }
.nearby .placeboard .distrat .location-cuddles strong,
.nearby .placeboard .distrat .distance a > span { right:-5px; bottom:-4px; }
.nearby .placeboard .room-presence-count {
  position:relative;
  gap:5px;
  min-height:29px;
  padding:4px 8px 4px 7px;
  border:1px solid rgba(116,222,175,.20);
  border-radius:999px;
  background:rgba(38,87,73,.25);
  color:#dff8eb;
  box-shadow:none;
}
.nearby .placeboard .room-presence-count .material-icons { display:none; }
.nearby .placeboard .room-presence-count::before { content:''; width:7px; height:7px; border-radius:50%; background:#7de4aa; box-shadow:0 0 0 3px rgba(125,228,170,.11),0 0 11px rgba(125,228,170,.44); }
.nearby .placeboard .room-presence-count b { min-width:17px; height:17px; background:rgba(109,203,157,.24); color:#f3fff8; }

/* The guest counter owns the right edge of every discovery card.  Whether a
 * room is empty or somebody just joins must never move it across the rail. */
.nearby .placeboard .room-user-preview::after {
  order: 1;
  margin-left: 8px;
}
.nearby .placeboard .room-user-preview .room-presence-count {
  order: 2;
  flex: 0 0 auto;
  margin-left: auto;
}

/* Inbox switch: no underline, route or separator. The active destination is
   recognised solely by its quiet surface and legible label. */
.notification .notification-tabs md-tabs-canvas,
.notification .notification-tabs .md-tab-bar,
.notification .notification-tabs md-tabs-content-wrapper {
  margin-top: 0;
  border: 0;
  box-shadow: none;
}
.notification .notification-tabs .md-ink-bar,
.notification .notification-tabs [class*="ink-bar"] {
  display: none;
  visibility: hidden;
  opacity: 0;
}
.notification .notification-tabs md-tab-item.md-active {
  background: rgba(124, 145, 208, .13);
  box-shadow: none;
}

/* Direct inbox switch. This intentionally does not use md-tabs: the two
 * destinations need an uncomplicated choice, without a travelling ink bar. */
.notification > md-content { display:flex; flex-direction:column; min-height:0; }
.notification-switch {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:3px;
  margin:0;
  padding:7px 12px 6px;
  background:rgba(19,25,43,.7);
}
.notification-switch button {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-width:0;
  height:38px;
  padding:0 9px;
  border:0;
  border-radius:10px;
  background:transparent;
  box-shadow:none;
  color:#a9afc1;
  font:760 11px/1 Ubuntu,Roboto,Arial,sans-serif;
  letter-spacing:.015em;
  cursor:pointer;
  transition:background-color 180ms ease,color 180ms ease;
}
.notification-switch button .material-icons { color:currentColor; font-size:17px; }
.notification-switch button:hover { background:rgba(255,255,255,.045); color:#e6eaf5; }
.notification-switch button.active { background:rgba(120,145,206,.14); color:#f4f6ff; }
.notification-switch button b {
  position:absolute;
  top:8px;
  right:11px;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#9ee6c0;
  box-shadow:0 0 8px rgba(108,224,163,.6);
}
.notification-panel { display:flex; flex:1 1 auto; min-height:0; }
.notification-panel > md-content { width:100%; min-height:0; }
@media (max-width:360px) {
  .notification-switch { padding-right:9px; padding-left:9px; }
  .notification-switch button { gap:5px; padding:0 5px; font-size:10px; }
  .notification-switch button .material-icons { font-size:15px; }
}


/* Sidebar finishing pass — final cascade. The header is LinkUUp night-blue,
   and navigation icons stay free of individual boxes. */
.md-sidenav-left,.md-sidenav-left md-content { background:radial-gradient(ellipse 92% 30% at 12% 0,rgba(66,157,229,.16),transparent 70%),radial-gradient(ellipse 68% 34% at 94% 37%,rgba(126,86,211,.14),transparent 72%),linear-gradient(162deg,#111c30 0%,#151a2d 51%,#0f1422 100%); }
.md-sidenav-left md-toolbar.sidenav-brand,.md-sidenav-left .sidenav-brand { min-height:82px; background:radial-gradient(circle at 88% 24%,rgba(99,189,247,.32),transparent 29%),linear-gradient(115deg,#32295d 0%,#1a3158 56%,#121d33 100%); border-bottom:1px solid rgba(184,219,255,.17); box-shadow:inset 0 -1px 0 rgba(255,255,255,.055),0 8px 19px rgba(4,9,22,.22); }
.md-sidenav-left .sidenav-brand .md-toolbar-tools { height:82px; }.md-sidenav-left .sidenav-brand h1 { color:#f7fbff; font-weight:760; letter-spacing:-.035em; }.md-sidenav-left .sidenav-brand span { color:#b7d6f0; }
.md-sidenav-left md-list-item .nav-icon,.md-sidenav-left md-list-item.nav-discover .nav-icon,.md-sidenav-left md-list-item.nav-profile .nav-icon,.md-sidenav-left md-list-item.nav-friends .nav-icon,.md-sidenav-left md-list-item.nav-settings .nav-icon,.md-sidenav-left md-list-item.nav-account .nav-icon,.md-sidenav-left md-list-item.nav-profile-settings .nav-icon,.md-sidenav-left md-list-item.nav-logout .nav-icon { width:24px; height:24px; margin-right:14px; border:0; border-radius:0; background:transparent; box-shadow:none; font-size:19px; }
.md-sidenav-left md-list-item:hover .nav-icon { transform:translateX(1px); background:transparent; box-shadow:none; }.md-sidenav-left md-list-item::before { background:transparent; }.md-sidenav-left md-list-item:hover { border-color:transparent; background:linear-gradient(90deg,rgba(84,157,223,.18),rgba(123,92,202,.07) 68%,transparent); }.md-sidenav-left md-list-item:hover::before { background:#9fddff; box-shadow:0 0 11px rgba(129,208,255,.62); }

/* Calibration pass: remove the two variable counters before comparing the
   pure QR and route controls.  Their shared badge returns only once both
   physical targets are locked to the same base geometry. */
.nearby .placeboard .distrat .location-cuddles strong,
.nearby .placeboard .distrat .distance a > span { display:none; }
.nearby .placeboard .distrat .location-cuddles,
.nearby .placeboard .distrat .distance a,
.nearby .placeboard .distrat .distance a > .material-icons {
  box-sizing:border-box;
  width:60px;
  min-width:60px;
  height:60px;
  border-radius:15px;
}
@media (max-width:390px) {
  .nearby .placeboard .distrat { right:18px; bottom:16px; left:18px; grid-template-columns:60px 60px; height:60px; }
  .nearby .placeboard .distrat .location-cuddles,.nearby .placeboard .distrat .distance,.nearby .placeboard .distrat .distance p,.nearby .placeboard .distrat .distance a,.nearby .placeboard .distrat .distance a > .material-icons { width:60px; min-width:60px; height:60px; }
}

/* Final nearby-card alignment: retained here at EOF so an older discovery
   experiment cannot reclaim the guest rail or stack the location actions. */
.nearby .placeboard .room-user-preview { top:auto; right:22px; bottom:100px; left:22px; }
.nearby .placeboard .distrat { right:24px; bottom:24px; left:24px; justify-content:space-between; gap:0; }
.nearby .placeboard .distrat .location-cuddles { transform:translateX(-17px); }
.nearby .placeboard .distrat .distance { transform:translateX(17px); }
@media (max-width:390px) { .nearby .placeboard .room-user-preview { right:17px; bottom:91px; left:17px; }.nearby .placeboard .distrat { right:21px; bottom:17px; left:21px; } }

/* Nearby placeboard final layout.  This intentionally remains at the physical
   end of the stylesheet: the file contains older explorations of the same
   components above.  Guests live in one calm rail below the place identity;
   route and Cuddle sit as equal, separated actions. */
.nearby .placeboard .room-category-hero {
  display:block;
  position:relative;
  min-height:182px;
}
.nearby .placeboard .room-category-orbit,
.nearby .placeboard .room-category-name,
.nearby .placeboard .room-hero-name,
.nearby .placeboard .room-hero-meta {
  position:relative;
  inset:auto;
  align-self:auto;
}
.nearby .placeboard .room-category-name,
.nearby .placeboard .room-hero-meta { display:block; }
.nearby .placeboard .room-hero-meta { margin-top:7px; }
.nearby .placeboard .room-user-preview {
  position:absolute;
  z-index:3;
  top:auto;
  right:22px;
  bottom:100px;
  left:22px;
  display:flex;
  align-items:center;
  min-height:48px;
  margin:0;
  padding:7px 10px;
  border:0;
  border-top:1px solid rgba(200,221,250,.16);
  border-radius:0;
  background:linear-gradient(90deg,rgba(80,130,186,.10),transparent 72%);
  box-shadow:none;
  transform:none;
}
.nearby .placeboard .room-user-preview::before { display:none; content:none; }
.nearby .placeboard .room-user-preview::after { display:block; }
.nearby .placeboard .room-user-preview .lup-avatar { width:36px; height:36px; margin-left:-10px; border:2px solid #20293a; transform:none; }
.nearby .placeboard .room-user-preview .lup-avatar:first-child { margin-left:0; }
.nearby .placeboard .room-user-preview .lup-avatar .img { width:32px; height:32px; }
.nearby .placeboard .room-presence-count { margin:0 0 0 9px; }
.nearby .placeboard .distrat {
  position:absolute;
  z-index:4;
  right:29px;
  bottom:24px;
  left:29px;
  display:flex;
  justify-content:space-between;
  gap:62px;
  width:auto;
  transform:none;
}
.nearby .placeboard .distrat .location-cuddles,
.nearby .placeboard .distrat .distance,
.nearby .placeboard .distrat .distance p,
.nearby .placeboard .distrat .distance a { width:58px; min-width:58px; height:58px; }
.nearby .placeboard .distrat .location-cuddles { border-radius:14px; }
.nearby .placeboard .distrat .distance a,
.nearby .placeboard .distrat .distance a > .material-icons { border-radius:50%; }
.nearby .placeboard .distrat .location-cuddles strong,
.nearby .placeboard .distrat .distance a > span { background:#172138; color:#f2f7ff; }
@media (max-width:390px) {
  .nearby .placeboard .room-category-hero { min-height:167px; }
  .nearby .placeboard .room-user-preview { right:17px; bottom:91px; left:17px; }
  .nearby .placeboard .room-user-preview::after { display:none; }
  .nearby .placeboard .distrat { right:25px; bottom:17px; left:25px; gap:50px; }
}

/* === Online view final cascade: retained at EOF so legacy experiments above
 * cannot alter the live visitor page. === */
@media (max-width:480px) {
  .lup-top-bar .md-toolbar-tools { min-width:0; padding-right:5px; padding-left:5px; }
  .lup-top-bar .location-top-identity,.lup-top-bar .location-top-copy { width:auto; min-width:0; }
  .lup-top-bar .location-top-copy .room-name { display:block; width:100%; min-width:0; overflow:hidden; font-size:12px; line-height:15px; letter-spacing:0; text-overflow:ellipsis; white-space:nowrap; word-break:normal; }
  .lup-top-bar .location-top-icon { flex-basis:29px; width:29px; height:29px; margin-right:6px; }
  .lup-top-bar .location-top-icon .material-icons { font-size:16px; }
  .lup-top-bar .location-top-copy > span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
}
.location-page md-list.usernavigation.location-online-view .online-room-header { display:grid; grid-template-columns:37px minmax(0,1fr) auto; align-items:center; gap:10px; min-height:59px; margin:0 0 13px; padding:0 2px 12px; border:0; border-bottom:1px solid rgba(183,216,248,.16); background:transparent; }
.location-page md-list.usernavigation.location-online-view .online-room-header .presence-live-mark { position:static; display:grid; place-items:center; width:37px; height:37px; margin:0; border:1px solid rgba(127,212,255,.45); border-radius:13px 13px 13px 5px; background:linear-gradient(145deg,rgba(70,163,225,.32),rgba(83,79,181,.20)); box-shadow:inset 0 1px 0 rgba(255,255,255,.17),0 0 18px rgba(77,177,248,.18); color:#d4f1ff; }
.location-page md-list.usernavigation.location-online-view .online-room-header .presence-live-mark .material-icons { font-size:20px; }
.location-page md-list.usernavigation.location-online-view .online-room-header .presence-header-copy { min-width:0; }
.location-page md-list.usernavigation.location-online-view .online-room-header .presence-header-copy strong { display:block; overflow:hidden; color:#f2f7ff; font-size:14px; font-weight:760; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }
.location-page md-list.usernavigation.location-online-view .online-room-header .presence-header-copy span { display:block; overflow:hidden; margin-top:3px; color:#9daec4; font-size:10px; line-height:1.25; text-overflow:ellipsis; white-space:nowrap; }
.location-page md-list.usernavigation.location-online-view .online-room-header .presence-total { position:static; display:grid; min-width:44px; min-height:38px; padding:4px 5px; border:1px solid rgba(130,223,178,.26); border-radius:12px; background:rgba(76,179,137,.09); text-align:right; }
.location-page md-list.usernavigation.location-online-view .online-room-header .presence-total strong { color:#f5fffa; font-size:18px; line-height:1; }
.location-page md-list.usernavigation.location-online-view .online-room-header .presence-total small { margin-top:3px; color:#8ce5b5; font-size:7px; font-weight:850; letter-spacing:.09em; }
@media (max-width:360px) { .location-page md-list.usernavigation.location-online-view .online-room-header { grid-template-columns:32px minmax(0,1fr) auto; gap:7px; min-height:53px; }.location-page md-list.usernavigation.location-online-view .online-room-header .presence-live-mark { width:32px; height:32px; }.location-page md-list.usernavigation.location-online-view .online-room-header .presence-live-mark .material-icons { font-size:18px; } }

/* A visitor has one live indicator only: the small dot on the centred avatar.
   The editable status remains readable as calm text, never as a second green control. */
.location-page md-list.usernavigation.location-online-view .presence-person .md-list-item-inner,
.location-page md-list.usernavigation.location-online-view .presence-person .md-list-item-inner > div {
  align-items:center;
}
.location-page md-list.usernavigation.location-online-view .presence-person .presence-avatar {
  display:block;
  flex:0 0 42px;
  width:42px;
  height:42px;
  margin-left:4px;
  margin-top:0;
  margin-bottom:0;
  align-self:center;
}
.location-page md-list.usernavigation.location-online-view .presence-person::before {
  display:none;
}
.location-page md-list.usernavigation.location-online-view .presence-person-copy p:last-child {
  display:block;
  overflow:hidden;
  margin:0;
  color:#aaa7b8;
  font-size:10px;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* iPhone 14 Pro Max (430 CSS px): the toolbar has four fixed controls.
 * Let the place title use only the remaining space and truncate as one
 * deliberate line instead of letting individual letters collide. */
@media (max-width:480px) {
  .lup-top-bar .md-toolbar-tools { min-width:0; padding-right:5px; padding-left:5px; }
  .lup-top-bar .location-top-identity { min-width:0; margin-left:0; }
  .lup-top-bar .location-top-copy { min-width:0; width:100%; }
  .lup-top-bar .location-top-copy .room-name {
    display:block;
    width:100%;
    min-width:0;
    overflow:hidden;
    font-size:12px;
    line-height:15px;
    letter-spacing:0;
    text-overflow:ellipsis;
    white-space:nowrap;
    word-break:normal;
  }
  .lup-top-bar .location-top-icon { flex-basis:29px; width:29px; height:29px; margin-right:6px; }
  .lup-top-bar .location-top-icon .material-icons { font-size:16px; }
  .lup-top-bar .location-top-copy > span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
}

/* Independent online header.  It no longer inherits the older Material
 * subheader experiments, so Online has one stable appearance on each screen. */
.location-page md-list.usernavigation.location-online-view .online-room-header {
  display:grid;
  grid-template-columns:37px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  min-height:59px;
  margin:0 0 13px;
  padding:0 2px 12px;
  border:0;
  border-bottom:1px solid rgba(183,216,248,.16);
  background:transparent;
}
.location-page md-list.usernavigation.location-online-view .online-room-header .presence-live-mark {
  position:static;
  display:grid;
  place-items:center;
  width:37px;
  height:37px;
  margin:0;
  border:1px solid rgba(127,212,255,.45);
  border-radius:13px 13px 13px 5px;
  background:linear-gradient(145deg,rgba(70,163,225,.32),rgba(83,79,181,.20));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.17),0 0 18px rgba(77,177,248,.18);
  color:#d4f1ff;
}
.location-page md-list.usernavigation.location-online-view .online-room-header .presence-live-mark .material-icons { font-size:20px; }
.location-page md-list.usernavigation.location-online-view .online-room-header .presence-header-copy { min-width:0; }
.location-page md-list.usernavigation.location-online-view .online-room-header .presence-header-copy strong {
  display:block;
  overflow:hidden;
  color:#f2f7ff;
  font-size:14px;
  font-weight:760;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.location-page md-list.usernavigation.location-online-view .online-room-header .presence-header-copy span {
  display:block;
  overflow:hidden;
  margin-top:3px;
  color:#9daec4;
  font-size:10px;
  line-height:1.25;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.location-page md-list.usernavigation.location-online-view .online-room-header .presence-total {
  position:static;
  display:grid;
  min-width:44px;
  min-height:38px;
  padding:4px 5px;
  border:1px solid rgba(130,223,178,.26);
  border-radius:12px;
  background:rgba(76,179,137,.09);
  text-align:right;
}
.location-page md-list.usernavigation.location-online-view .online-room-header .presence-total strong { color:#f5fffa; font-size:18px; line-height:1; }
.location-page md-list.usernavigation.location-online-view .online-room-header .presence-total small { margin-top:3px; color:#8ce5b5; font-size:7px; font-weight:850; letter-spacing:.09em; }
@media (max-width:360px) {
  .location-page md-list.usernavigation.location-online-view .online-room-header { grid-template-columns:32px minmax(0,1fr) auto; gap:7px; min-height:53px; }
  .location-page md-list.usernavigation.location-online-view .online-room-header .presence-live-mark { width:32px; height:32px; }
  .location-page md-list.usernavigation.location-online-view .online-room-header .presence-live-mark .material-icons { font-size:18px; }
}

/* Online view: a stable, compact room roster.  This is intentionally scoped
 * to the visitor tab so the desktop side panel and the chat remain untouched. */
.location-page md-list.usernavigation.location-online-view {
  min-height:0;
  padding:16px 14px 18px;
}
.location-page md-list.usernavigation.location-online-view .location-presence-heading {
  margin:0 0 12px;
}
.location-page md-list.usernavigation.location-online-view .location-presence-heading .md-subheader-inner {
  min-height:56px;
  padding:0 2px 11px;
  border-bottom-color:rgba(178,211,248,.14);
}
.location-page md-list.usernavigation.location-online-view .presence-live-mark {
  flex:0 0 35px;
  width:35px;
  height:35px;
  border-radius:12px 12px 12px 5px;
}
.location-page md-list.usernavigation.location-online-view .presence-total {
  flex-basis:44px;
  min-width:44px;
  min-height:38px;
}
.location-page md-list.usernavigation.location-online-view .visitors-list {
  max-height:calc(100dvh - 202px);
  padding:1px 0 12px;
}
.location-page md-list.usernavigation.location-online-view .presence-person {
  min-height:68px;
  margin:7px 0;
  padding:9px 9px 9px 11px;
}
.location-page md-list.usernavigation.location-online-view .presence-person .presence-avatar,
.location-page md-list.usernavigation.location-online-view .presence-person .presence-avatar img {
  width:42px;
  height:42px;
}
.location-page md-list.usernavigation.location-online-view .presence-actions {
  flex:0 0 auto;
  margin-left:7px;
}
.location-page md-list.usernavigation.location-online-view .presence-actions .presence-action {
  width:30px;
  min-width:30px;
  height:30px;
}
@media (max-width:360px) {
  .location-page md-list.usernavigation.location-online-view { padding:12px 10px 16px; }
  .location-page md-list.usernavigation.location-online-view .presence-person { padding-right:6px; padding-left:8px; }
  .location-page md-list.usernavigation.location-online-view .presence-person .presence-avatar,
  .location-page md-list.usernavigation.location-online-view .presence-person .presence-avatar img { width:38px; height:38px; }
  .location-page md-list.usernavigation.location-online-view .presence-actions { gap:2px; margin-left:4px; }
  .location-page md-list.usernavigation.location-online-view .presence-actions .presence-action { width:27px; min-width:27px; height:27px; }
}

/* Venue stage final cascade. It is intentionally at EOF: older venue styles
   below the first draft used to repaint this view once the full stylesheet
   finished loading. */
.venue-view { min-height:100%; background:radial-gradient(ellipse 95% 34% at 48% -8%,color-mix(in srgb,var(--venue-accent) 18%,transparent),transparent 74%),radial-gradient(circle at 5% 74%,color-mix(in srgb,var(--venue-accent) 8%,transparent),transparent 29%),linear-gradient(160deg,#121a2a 0%,#0c1120 72%); }
.venue-view::after { content:''; position:absolute; z-index:-1; inset:0; opacity:.28; pointer-events:none; background-image:radial-gradient(rgba(180,220,255,.32) .55px,transparent .75px); background-size:22px 22px; mask-image:linear-gradient(#000,transparent 66%); }
.venue-atmosphere { top:-12px; right:-46px; width:230px; height:230px; opacity:.15; }.venue-atmosphere .material-icons { top:27px; right:26px; font-size:180px; }
.venue-signal-route { position:absolute; z-index:-1; top:102px; left:-23px; width:74%; height:170px; pointer-events:none; opacity:.64; }.venue-signal-route::before { content:''; position:absolute; top:54px; right:0; left:0; height:1px; background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--venue-accent) 72%,#bfeaff),transparent); transform:rotate(-13deg); transform-origin:left; box-shadow:0 0 14px var(--venue-glow); }.venue-signal-route i { position:absolute; display:block; width:5px; height:5px; border-radius:50%; background:#d7f4ff; box-shadow:0 0 0 4px color-mix(in srgb,var(--venue-accent) 14%,transparent),0 0 13px var(--venue-accent); }.venue-signal-route i:nth-child(1) { top:49px; left:18%; }.venue-signal-route i:nth-child(2) { top:31px; left:54%; }.venue-signal-route i:nth-child(3) { top:14px; left:84%; }
.venue-identity { min-height:142px; grid-template-columns:61px minmax(0,1fr) 38px; gap:14px; padding:23px 17px 19px; border-bottom:1px solid color-mix(in srgb,var(--venue-accent) 27%,rgba(255,255,255,.08)); background:linear-gradient(111deg,color-mix(in srgb,var(--venue-accent) 20%,#1d2944),rgba(14,18,32,.90) 68%,rgba(12,16,28,.62)); }.venue-identity::after { right:17px; left:17px; height:1px; background:linear-gradient(90deg,var(--venue-accent),rgba(194,231,255,.17) 38%,transparent 78%); }.venue-category-mark { width:57px; height:57px; border-radius:20px 20px 20px 7px; background:linear-gradient(145deg,color-mix(in srgb,var(--venue-accent) 55%,#7e8fa9),#273147); box-shadow:inset 0 1px 0 rgba(255,255,255,.36),0 14px 28px rgba(0,0,0,.27),0 0 28px var(--venue-glow); }.venue-category-mark .material-icons { font-size:31px; }.venue-title > span { color:color-mix(in srgb,var(--venue-accent) 84%,#fff); font-size:9px; letter-spacing:.15em; }.venue-title h1 { margin:5px 0; font-size:clamp(22px,5.8vw,31px); font-weight:690; letter-spacing:-.05em; line-height:1.02; }.venue-title p { color:#b8c6d9; font-size:11px; }.venue-local-state { display:flex; align-items:center; gap:4px; margin-top:7px; color:#91e1b6; font-size:9px; font-weight:800; letter-spacing:.03em; }.venue-local-state .material-icons { font-size:12px; }.venue-local-state-view { color:#a8cbe9; }.venue-hours { width:38px; height:38px; border-color:rgba(194,224,255,.16); border-radius:13px 13px 13px 5px; background:rgba(8,15,29,.34); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }
.venue-rating { width:calc(100% - 32px); min-height:78px; margin:16px 16px 12px; padding:12px 14px; border-color:color-mix(in srgb,var(--venue-accent) 42%,rgba(255,255,255,.12)); border-radius:18px; background:linear-gradient(115deg,color-mix(in srgb,var(--venue-accent) 17%,rgba(255,255,255,.06)),rgba(13,19,33,.72)); box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 14px 29px rgba(0,0,0,.15); }.venue-rating::before { content:''; position:absolute; top:0; left:17px; width:40%; height:1px; background:linear-gradient(90deg,var(--venue-accent),transparent); }.venue-rating::after { right:14px; bottom:9px; font-size:7px; }.venue-rating-number strong { color:#fff1b6; font-size:28px; text-shadow:0 0 18px rgba(255,216,112,.16); }.venue-rating-number span { color:#aabbd0; font-size:8px; }.venue-stars { gap:1px; }.venue-stars .material-icons { font-size:21px; }.venue-rating-meta { min-width:48px; }.venue-rating-meta b { color:#e9f3ff; font-size:15px; }.venue-rating-meta span { color:#aabbd0; }
.venue-actions { gap:0; margin:0 16px 17px; overflow:hidden; border:1px solid rgba(192,218,255,.14); border-radius:18px; background:rgba(8,14,27,.36); box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 11px 23px rgba(0,0,0,.11); }.venue-action { position:relative; min-height:86px; border:0; border-radius:0; background:transparent; box-shadow:none; }.venue-action + .venue-action { border-left:1px solid rgba(193,218,255,.11); }.venue-action::before { content:''; position:absolute; top:0; width:32%; height:1px; background:linear-gradient(90deg,transparent,var(--venue-accent),transparent); opacity:.7; }.venue-action:hover { transform:none; background:color-mix(in srgb,var(--venue-accent) 10%,rgba(255,255,255,.025)); }.venue-action .material-icons { font-size:25px; }.venue-action span { font-size:11px; }.venue-action small { max-width:92%; color:#9baec4; font-size:8px; }
.venue-voices { position:relative; margin:0 16px 21px; padding:18px 15px 13px; border-color:rgba(194,220,255,.15); border-radius:21px; background:linear-gradient(145deg,rgba(31,43,70,.78),rgba(13,19,33,.84)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 17px 34px rgba(0,0,0,.15); }.venue-voices::before { content:''; position:absolute; top:0; left:16px; width:54px; height:2px; border-radius:0 0 3px 3px; background:linear-gradient(90deg,var(--venue-accent),#b8e6ff); box-shadow:0 0 14px var(--venue-glow); }.venue-voices-head { margin-bottom:12px; }.venue-voices-head h2 { font-size:17px; letter-spacing:-.025em; }.venue-voices-head button { color:#c8eaff; }.venue-voice { grid-template-columns:36px minmax(0,1fr); gap:10px; padding:12px 0; }.venue-voice lup-avatar,.venue-voice lup-avatar .avatar,.venue-voice lup-avatar img { width:36px; height:36px; }.venue-voice-main p { color:#d8e2f0; font-size:11px; line-height:1.45; }.venue-note { margin:0 16px 28px; padding:13px; border-left-width:3px; color:#bfcddd; }
@media (max-width:360px) { .venue-identity { grid-template-columns:49px minmax(0,1fr) 34px; gap:10px; padding:18px 11px 16px; }.venue-category-mark { width:47px; height:47px; }.venue-title h1 { font-size:20px; }.venue-rating,.venue-actions,.venue-voices,.venue-note { width:calc(100% - 22px); margin-right:11px; margin-left:11px; }.venue-action small { display:none; } }
@media (prefers-reduced-motion:reduce) { .venue-signal-route { display:none; } }

/* Venue stage: the location tab is LinkUUp's premium public face. One
   continuous scene gives the place, its reputation and guest voices a clear
   visual order without taking functionality away from route, ratings or chat. */
.venue-view {
  min-height:100%;
  background:
    radial-gradient(ellipse 95% 34% at 48% -8%,color-mix(in srgb,var(--venue-accent) 18%,transparent),transparent 74%),
    radial-gradient(circle at 5% 74%,color-mix(in srgb,var(--venue-accent) 8%,transparent),transparent 29%),
    linear-gradient(160deg,#121a2a 0%,#0c1120 72%);
}
.venue-view::after { content:''; position:absolute; z-index:-1; inset:0; opacity:.28; pointer-events:none; background-image:radial-gradient(rgba(180,220,255,.32) .55px,transparent .75px); background-size:22px 22px; mask-image:linear-gradient(#000,transparent 66%); }
.venue-atmosphere { top:-12px; right:-46px; width:230px; height:230px; opacity:.15; }.venue-atmosphere .material-icons { top:27px; right:26px; font-size:180px; }
.venue-signal-route { position:absolute; z-index:-1; top:102px; left:-23px; width:74%; height:170px; pointer-events:none; opacity:.64; }.venue-signal-route::before { content:''; position:absolute; top:54px; right:0; left:0; height:1px; background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--venue-accent) 72%,#bfeaff),transparent); transform:rotate(-13deg); transform-origin:left; box-shadow:0 0 14px var(--venue-glow); }.venue-signal-route i { position:absolute; display:block; width:5px; height:5px; border-radius:50%; background:#d7f4ff; box-shadow:0 0 0 4px color-mix(in srgb,var(--venue-accent) 14%,transparent),0 0 13px var(--venue-accent); }.venue-signal-route i:nth-child(1) { top:49px; left:18%; }.venue-signal-route i:nth-child(2) { top:31px; left:54%; }.venue-signal-route i:nth-child(3) { top:14px; left:84%; }
.venue-identity { min-height:142px; grid-template-columns:61px minmax(0,1fr) 38px; gap:14px; padding:23px 17px 19px; border-bottom:1px solid color-mix(in srgb,var(--venue-accent) 27%,rgba(255,255,255,.08)); background:linear-gradient(111deg,color-mix(in srgb,var(--venue-accent) 20%,#1d2944),rgba(14,18,32,.90) 68%,rgba(12,16,28,.62)); }
.venue-identity::after { right:17px; left:17px; height:1px; background:linear-gradient(90deg,var(--venue-accent),rgba(194,231,255,.17) 38%,transparent 78%); }
.venue-category-mark { width:57px; height:57px; border-radius:20px 20px 20px 7px; background:linear-gradient(145deg,color-mix(in srgb,var(--venue-accent) 55%,#7e8fa9),#273147); box-shadow:inset 0 1px 0 rgba(255,255,255,.36),0 14px 28px rgba(0,0,0,.27),0 0 28px var(--venue-glow); }.venue-category-mark .material-icons { font-size:31px; }
.venue-title > span { color:color-mix(in srgb,var(--venue-accent) 84%,#fff); font-size:9px; letter-spacing:.15em; }.venue-title h1 { margin:5px 0 5px; font-size:clamp(22px,5.8vw,31px); font-weight:690; letter-spacing:-.05em; line-height:1.02; }.venue-title p { color:#b8c6d9; font-size:11px; }.venue-local-state { display:flex; align-items:center; gap:4px; margin-top:7px; color:#91e1b6; font-size:9px; font-weight:800; letter-spacing:.03em; }.venue-local-state .material-icons { font-size:12px; }.venue-local-state-view { color:#a8cbe9; }
.venue-hours { width:38px; height:38px; border-color:rgba(194,224,255,.16); border-radius:13px 13px 13px 5px; background:rgba(8,15,29,.34); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }
.venue-rating { width:calc(100% - 32px); min-height:78px; margin:16px 16px 12px; padding:12px 14px; border-color:color-mix(in srgb,var(--venue-accent) 42%,rgba(255,255,255,.12)); border-radius:18px; background:linear-gradient(115deg,color-mix(in srgb,var(--venue-accent) 17%,rgba(255,255,255,.06)),rgba(13,19,33,.72)); box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 14px 29px rgba(0,0,0,.15); }.venue-rating::before { content:''; position:absolute; top:0; left:17px; width:40%; height:1px; background:linear-gradient(90deg,var(--venue-accent),transparent); }.venue-rating::after { right:14px; bottom:9px; font-size:7px; }
.venue-rating-number strong { color:#fff1b6; font-size:28px; text-shadow:0 0 18px rgba(255,216,112,.16); }.venue-rating-number span { color:#aabbd0; font-size:8px; }.venue-stars { gap:1px; }.venue-stars .material-icons { font-size:21px; }.venue-rating-meta { min-width:48px; }.venue-rating-meta b { color:#e9f3ff; font-size:15px; }.venue-rating-meta span { color:#aabbd0; }
.venue-actions { gap:0; margin:0 16px 17px; overflow:hidden; border:1px solid rgba(192,218,255,.14); border-radius:18px; background:rgba(8,14,27,.36); box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 11px 23px rgba(0,0,0,.11); }.venue-action { position:relative; min-height:86px; border:0; border-radius:0; background:transparent; box-shadow:none; }.venue-action + .venue-action { border-left:1px solid rgba(193,218,255,.11); }.venue-action::before { content:''; position:absolute; top:0; width:32%; height:1px; background:linear-gradient(90deg,transparent,var(--venue-accent),transparent); opacity:.7; }.venue-action:hover { transform:none; background:color-mix(in srgb,var(--venue-accent) 10%,rgba(255,255,255,.025)); }.venue-action .material-icons { font-size:25px; }.venue-action span { font-size:11px; }.venue-action small { max-width:92%; color:#9baec4; font-size:8px; }
.venue-voices { position:relative; margin:0 16px 21px; padding:18px 15px 13px; border-color:rgba(194,220,255,.15); border-radius:21px; background:linear-gradient(145deg,rgba(31,43,70,.78),rgba(13,19,33,.84)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 17px 34px rgba(0,0,0,.15); }.venue-voices::before { content:''; position:absolute; top:0; left:16px; width:54px; height:2px; border-radius:0 0 3px 3px; background:linear-gradient(90deg,var(--venue-accent),#b8e6ff); box-shadow:0 0 14px var(--venue-glow); }.venue-voices-head { margin-bottom:12px; }.venue-voices-head h2 { font-size:17px; letter-spacing:-.025em; }.venue-voices-head button { color:#c8eaff; }
.venue-voice { grid-template-columns:36px minmax(0,1fr); gap:10px; padding:12px 0; }.venue-voice lup-avatar,.venue-voice lup-avatar .avatar,.venue-voice lup-avatar img { width:36px; height:36px; }.venue-voice-main p { color:#d8e2f0; font-size:11px; line-height:1.45; }.venue-note { margin:0 16px 28px; padding:13px; border-left-width:3px; color:#bfcddd; }
@media (max-width:360px) { .venue-identity { grid-template-columns:49px minmax(0,1fr) 34px; gap:10px; padding:18px 11px 16px; }.venue-category-mark { width:47px; height:47px; }.venue-title h1 { font-size:20px; }.venue-rating,.venue-actions,.venue-voices,.venue-note { width:calc(100% - 22px); margin-right:11px; margin-left:11px; }.venue-actions { width:calc(100% - 22px); }.venue-action small { display:none; } }
@media (prefers-reduced-motion:reduce) { .venue-signal-route { display:none; } }

/* Settings, account and profile administration share the same calm, tactile
   system as the public LinkUUp surfaces.  These selectors intentionally sit
   last, so dynamically rendered setting controls receive one stable look. */
.settings-page > md-content,
.account-page > md-content,
.profile-settings-page > md-content {
  background:
    radial-gradient(circle at 92% 0,rgba(115,91,232,.17),transparent 30%),
    radial-gradient(circle at 5% 22%,rgba(63,170,236,.10),transparent 26%),
    linear-gradient(155deg,#171a29,#10121c 82%);
}
.settings-page .lup-settings-list,
.profile-settings-page md-list {
  position:relative;
  max-width:760px;
  padding:16px 13px 32px;
}
.settings-page .lup-settings-list::before,
.profile-settings-page md-list::before {
  content:none;
  display:none;
}
.settings-page .lup-settings-list .md-subheader,
.profile-settings-page .md-subheader {
  display:flex;
  align-items:center;
  min-height:30px;
  margin:18px 5px 8px;
  padding:0 2px;
  color:#c7c1e2;
  font-size:10px;
  letter-spacing:.13em;
}
.settings-page .lup-settings-list md-list-item.md-2-line,
.profile-settings-page md-list-item {
  position:relative;
  overflow:hidden;
  min-height:73px;
  margin:8px 0;
  padding:8px 13px;
  border:1px solid rgba(213,221,255,.105);
  border-radius:17px;
  background:linear-gradient(128deg,rgba(255,255,255,.075),rgba(255,255,255,.028));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 9px 20px rgba(0,0,0,.12);
}
.settings-page .lup-settings-list md-list-item.md-2-line::before,
.profile-settings-page md-list-item::before {
  content:none;
  display:none;
}
.settings-page .lup-settings-list md-list-item.md-2-line:hover,
.profile-settings-page md-list-item:hover {
  transform:translateY(-1px);
  border-color:rgba(166,179,255,.34);
  background:linear-gradient(128deg,rgba(127,111,221,.20),rgba(67,162,213,.09));
}
.settings-page .lup-settings-list .md-list-item-text h3,
.profile-settings-page h5 { margin:0; color:#faf9ff; font-size:14px; font-weight:760; letter-spacing:.01em; }
.settings-page .lup-settings-list md-select,
.profile-settings-page md-select {
  min-width:126px;
  padding:7px 10px 4px;
  border:1px solid rgba(190,202,255,.21);
  border-radius:11px;
  background:rgba(18,21,33,.64);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
}
.settings-page .lup-settings-list .lup-setting-input input,
.settings-page .lup-settings-list .lup-setting-input textarea,
.profile-settings-page md-input-container input,
.profile-settings-page md-input-container textarea {
  border:1px solid rgba(190,202,255,.18);
  border-radius:11px;
  background:rgba(15,18,29,.58);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.settings-page .lup-settings-list .lup-setting-input input { height:39px; padding:0 10px; }
.settings-page .lup-settings-list .lup-setting-input textarea { padding:10px; }
.settings-page .lup-settings-list .md-switch-thumb { background:#f5f3ff; }
.settings-page .lup-settings-list .md-switch.md-checked .md-bar { background:rgba(125,103,237,.52); }
.settings-page .lup-settings-list .md-switch.md-checked .md-thumb { background:#a995ff; box-shadow:0 0 12px rgba(170,147,255,.56); }

.account-page section[layout-padding] { width:min(100%,760px); margin:0 auto; padding:22px 17px 34px; color:#e8e6f2; }
.account-page section[layout-padding] > h4 { display:flex; align-items:center; gap:9px; margin:0; color:#f9f8ff; font-size:22px; }.account-page section[layout-padding] > h4::before { content:'manage_accounts'; font-family:'Material Icons'; display:grid; place-items:center; width:34px; height:34px; border:1px solid rgba(170,191,255,.32); border-radius:11px; background:linear-gradient(145deg,rgba(108,145,236,.44),rgba(112,83,180,.30)); color:#eaf2ff; font-size:20px; }.account-page section[layout-padding] > p:first-of-type { margin:9px 0 17px; color:#bdb8ce; font-size:12px; line-height:1.45; }
.account-page .lup-account-overview { overflow:hidden; margin:0 0 16px; border:1px solid rgba(218,224,255,.12); border-radius:17px; background:rgba(255,255,255,.045); box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 10px 22px rgba(0,0,0,.14); }.account-page .lup-account-overview > div { position:relative; display:grid; gap:5px; padding:14px 16px 14px 20px; }.account-page .lup-account-overview > div + div { border-top:1px solid rgba(255,255,255,.08); }.account-page .lup-account-overview > div::before { content:''; position:absolute; top:15px; bottom:15px; left:0; width:2px; background:linear-gradient(#84c8ff,#9d8dff); }.account-page .lup-account-overview strong { color:#aaa8be; font-size:9px; font-weight:850; letter-spacing:.12em; text-transform:uppercase; }.account-page .lup-account-overview span { overflow:hidden; color:#faf9ff; font-size:15px; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }.account-page .lup-account-backend-hint { margin:16px 3px 10px; color:#b8b2c9; font-size:11px; }.account-page .md-raised.md-primary { min-height:42px; margin:0; border:1px solid rgba(169,156,255,.42); border-radius:13px; background:linear-gradient(135deg,#7862d2,#4f83c5); box-shadow:inset 0 1px 0 rgba(255,255,255,.26),0 8px 18px rgba(73,92,179,.25); color:#fff; font-weight:800; letter-spacing:.02em; }

@media (max-width:420px) { .settings-page .lup-settings-list md-list-item.md-2-line,.profile-settings-page md-list-item { padding-right:10px; padding-left:11px; }.settings-page .lup-settings-list md-select,.profile-settings-page md-select { min-width:104px; max-width:46vw; }.account-page section[layout-padding] { padding-right:12px; padding-left:12px; } }

/* Visit chronicle: measured, calm and useful rather than a gamified list. */
.course-page { width:min(100%,760px); margin:0 auto; padding:15px 14px 34px; color:var(--lup-text); background:radial-gradient(circle at 90% 0,rgba(101,137,235,.14),transparent 28%),transparent; }
.course-hero { display:flex; align-items:center; gap:13px; padding:13px 3px 14px; }.course-hero-mark { display:grid; place-items:center; flex:0 0 44px; width:44px; height:44px; border:1px solid rgba(163,193,255,.30); border-radius:14px 14px 14px 6px; background:linear-gradient(145deg,rgba(103,148,235,.42),rgba(92,80,174,.28)); box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 8px 17px rgba(0,0,0,.18); color:#ebf2ff; }.course-hero-mark .material-icons { font-size:24px; }.course-hero small,.course-stop-main small,.course-list-heading small { color:#aeb8d6; font-size:8px; font-weight:850; letter-spacing:.12em; }.course-hero h2 { margin:3px 0; color:#f6f5fc; font-size:20px; line-height:1.05; }.course-hero p { margin:0; color:var(--lup-muted); font-size:11px; }
.course-overview { display:grid; grid-template-columns:1fr 1fr 1.4fr; gap:1px; overflow:hidden; border:1px solid rgba(255,255,255,.09); border-radius:16px; background:rgba(255,255,255,.08); box-shadow:inset 0 1px 0 rgba(255,255,255,.06); }.course-overview > div { display:flex; flex-direction:column; justify-content:center; min-height:67px; padding:9px 11px; background:rgba(31,34,50,.84); }.course-overview strong { color:#f7f5ff; font-size:21px; line-height:1; }.course-overview span { margin-top:5px; color:#aaa6bd; font-size:9px; font-weight:700; }.course-overview .course-goal { flex-direction:row; align-items:center; gap:8px; background:linear-gradient(135deg,rgba(105,140,220,.20),rgba(88,78,155,.14)); }.course-goal .material-icons { color:#a9c8ff; font-size:21px; }.course-goal span { margin:0; color:#dfeaff; font-size:10px; line-height:1.25; }
.course-ranking-note { display:flex; align-items:center; gap:7px; margin:10px 2px 0; color:#aebbd3; font-size:10px; line-height:1.35; }.course-ranking-note .material-icons { color:#9dcbff; font-size:15px; }.course-list-heading { display:flex; align-items:end; justify-content:space-between; gap:12px; margin:21px 3px 7px; }.course-list-heading h3 { margin:3px 0 0; color:#f2f5ff; font-size:16px; line-height:1.1; }.course-list-heading > span { color:#95a3bd; font-size:9px; }
.course-timeline { position:relative; margin-top:18px; }.course-timeline::before { content:''; position:absolute; top:13px; bottom:13px; left:18px; width:1px; background:linear-gradient(rgba(145,180,255,.55),rgba(145,180,255,.08)); }.course-stop { position:relative; display:grid; grid-template-columns:38px 51px minmax(0,1fr) auto; align-items:center; gap:10px; min-height:88px; margin:9px 0; padding:10px 11px 10px 0; border:1px solid rgba(255,255,255,.09); border-radius:17px; background:linear-gradient(110deg,rgba(89,112,177,.14),rgba(255,255,255,.035)); box-shadow:inset 0 1px 0 rgba(255,255,255,.06); cursor:pointer; transition:transform .18s ease,border-color .18s ease,background .18s ease; }.course-stop:hover { transform:translateY(-2px); border-color:rgba(165,191,255,.38); background:linear-gradient(110deg,rgba(103,136,220,.23),rgba(255,255,255,.055)); }.course-stop-pin { z-index:1; display:grid; place-items:center; width:38px; height:38px; border:1px solid rgba(173,201,255,.38); border-radius:50%; background:#282d43; color:#a9c9ff; }.course-stop-pin .material-icons { font-size:19px; }.course-stop-icon { display:grid; place-items:center; width:51px; height:51px; border:1px solid rgba(255,255,255,.16); border-radius:13px 13px 13px 6px; background:linear-gradient(145deg,#3c4360,#252a3d); box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 6px 14px rgba(0,0,0,.18); }.course-stop-icon .material-icons { color:#e8efff; font-size:26px; }.course-icon-city { background:linear-gradient(145deg,#386c9c,#33446b); }.course-icon-bar { background:linear-gradient(145deg,#a95b57,#563a59); }.course-icon-cafe { background:linear-gradient(145deg,#a67754,#60483f); }.course-icon-club { background:linear-gradient(145deg,#a25cae,#49305d); }.course-icon-culture { background:linear-gradient(145deg,#477eb5,#314d74); }.course-icon-sport,.course-icon-outdoors { background:linear-gradient(145deg,#4b9a79,#315a59); }.course-icon-food { background:linear-gradient(145deg,#bd724c,#72433d); }.course-icon-education { background:linear-gradient(145deg,#4f9aab,#344f71); }.course-icon-health { background:linear-gradient(145deg,#bd6682,#693a59); }.course-stop-main { min-width:0; }.course-stop-main h3 { display:-webkit-box; overflow:hidden; margin:3px 0 4px; color:#f3f1fa; font-size:14px; line-height:1.15; -webkit-box-orient:vertical; -webkit-line-clamp:2; }.course-stop-main p { display:flex; align-items:center; gap:3px; overflow:hidden; margin:0; color:#b9b5ca; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }.course-stop-main p .material-icons { color:#98baf0; font-size:13px; }.course-stop-main p span { color:#8e8aa1; }.course-stop-count { display:grid; justify-items:center; min-width:43px; padding-left:6px; border-left:1px solid rgba(255,255,255,.09); }.course-stop-count strong { color:#e7efff; font-size:18px; line-height:1; }.course-stop-count span { margin-top:3px; color:#9ba7c5; font-size:7px; font-weight:850; letter-spacing:.06em; text-transform:uppercase; }.course-empty { display:grid; justify-items:center; gap:7px; margin-top:18px; padding:31px 22px; border:1px dashed rgba(171,185,231,.24); border-radius:18px; background:rgba(255,255,255,.025); color:#d9d6e6; text-align:center; }.course-empty .material-icons { color:#9fbef2; font-size:31px; }.course-empty span { color:#a8a3b8; font-size:11px; line-height:1.45; }
@media (max-width:420px) { .course-page { padding-right:10px; padding-left:10px; }.course-overview { grid-template-columns:1fr 1fr; }.course-overview .course-goal { grid-column:1 / -1; min-height:43px; }.course-stop { grid-template-columns:32px 45px minmax(0,1fr) 42px; gap:7px; }.course-stop-pin { width:32px; height:32px; }.course-stop > img { width:45px; height:45px; }.course-stop-main h3 { font-size:12px; }.course-stop-main p span { display:none; } }

/* Settings are a personal route, not a backend table. The route marker gives
   orientation; every choice remains deliberately quiet and mobile-safe. */
.settings-page .lup-settings-top-bar {
  background:linear-gradient(100deg,#121928 0%,#18233a 58%,#121827 100%);
  border-bottom:1px solid rgba(176,211,247,.12);
  box-shadow:0 8px 22px rgba(1,7,20,.18);
}
.settings-page .lup-settings-list { width:min(100%,760px); margin:0 auto; padding:16px 14px 40px; }
.settings-page .settings-hero { display:grid; grid-template-columns:42px minmax(0,1fr); gap:12px; align-items:start; margin:2px 2px 19px; padding:5px 3px 14px; border-bottom:1px solid rgba(181,210,242,.13); }
.settings-page .settings-hero-route { display:grid; place-items:center; width:40px; height:40px; border:1px solid rgba(168,207,247,.25); border-radius:15px 15px 15px 5px; background:linear-gradient(145deg,rgba(92,151,215,.28),rgba(113,91,183,.16)); box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 8px 18px rgba(0,0,0,.16); color:#d9efff; }
.settings-page .settings-hero-route .material-icons { font-size:21px; }
.settings-page .settings-hero small { display:block; margin:1px 0 4px; color:#9bb9d7; font-size:9px; font-weight:850; letter-spacing:.15em; }
.settings-page .settings-hero h1 { margin:0; color:#f7f8ff; font-size:22px; font-weight:710; letter-spacing:-.035em; line-height:1.05; }
.settings-page .settings-hero p { margin:6px 0 0; color:#adbbce; font-size:11px; line-height:1.45; }
.settings-page .lup-settings-profile-visibility { margin:0 0 21px; padding:12px; border:1px solid rgba(165,202,240,.16); border-radius:17px 17px 17px 6px; background:linear-gradient(120deg,rgba(90,142,205,.14),rgba(255,255,255,.025) 68%,rgba(121,95,191,.08)); box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 12px 24px rgba(0,0,0,.10); }
.settings-page .settings-visibility-heading { display:flex; flex-direction:column; gap:3px; padding:0 2px 9px; }
.settings-page .settings-visibility-heading span { color:#e5effb; font-size:13px; font-weight:760; }
.settings-page .settings-visibility-heading small { color:#a5b8ce; font-size:10px; line-height:1.35; }
.settings-page .lup-settings-profile-visibility md-list-item.md-2-line { min-height:59px; margin:0; padding:5px 0; border:0; border-top:1px solid rgba(189,216,244,.12); border-radius:0; background:transparent; box-shadow:none; }
.settings-page .lup-settings-group { margin:0 0 25px; }
.settings-page .lup-settings-group::before { display:none; }
.settings-page .lup-settings-group-heading { min-height:0; margin:0 2px 8px; padding:0; border:0; }
.settings-page .lup-settings-group-heading .md-subheader { display:block; min-height:0; margin:0; padding:0; color:inherit; }
.settings-page .lup-settings-group-heading b { display:block; color:#e4edf9; font-size:12px; font-weight:820; letter-spacing:.045em; text-transform:none; }
.settings-page .lup-settings-group-heading small { display:block; margin-top:3px; color:#92a9c1; font-size:10px; font-weight:500; letter-spacing:0; line-height:1.35; text-transform:none; }
.settings-page .lup-settings-list md-list-item.md-2-line { min-height:70px; margin:6px 0; padding:8px 12px; border-color:rgba(196,217,241,.12); border-radius:15px 15px 15px 6px; background:linear-gradient(117deg,rgba(214,230,247,.065),rgba(255,255,255,.021) 66%,rgba(123,105,189,.04)); }
.settings-page .lup-settings-list .md-list-item-text h3 { color:#f2f5fb; font-size:13px; font-weight:690; white-space:normal; }
.settings-page .settings-date-hint { margin:3px 0 0; color:#9cb7d1; font-size:10px; }
.settings-page .lup-setting-controls { gap:7px; margin-left:9px; }
.settings-page .lup-settings-list md-select,.settings-page .lup-settings-list .lup-setting-input input,.settings-page .lup-settings-list .lup-setting-input textarea { border-radius:10px; background:rgba(5,12,24,.34); }
.settings-page .lup-settings-list .lup-setting-date { min-width:142px; }
.settings-page .lup-settings-list .lup-setting-date input { min-width:132px; font-variant-numeric:tabular-nums; }
.settings-page .lup-settings-list input:focus,.settings-page .lup-settings-list textarea:focus { border-color:rgba(154,204,244,.45); box-shadow:0 0 0 2px rgba(104,167,225,.09); }
@media (max-width:420px) {
  .settings-page .lup-settings-list { padding:13px 11px 31px; }
  .settings-page .settings-hero { grid-template-columns:36px minmax(0,1fr); gap:10px; margin-bottom:16px; }
  .settings-page .settings-hero-route { width:35px; height:35px; border-radius:12px 12px 12px 4px; }
  .settings-page .settings-hero-route .material-icons { font-size:19px; }
  .settings-page .settings-hero h1 { font-size:20px; }
  .settings-page .settings-hero p { font-size:10px; }
  .settings-page .lup-settings-list md-list-item.md-2-line { min-height:66px; padding:7px 9px; }
  .settings-page .lup-settings-list .md-list-item-text h3 { font-size:12px; }
  .settings-page .lup-setting-controls { margin-left:5px; }
  .settings-page .lup-settings-list .lup-setting-date { min-width:122px; }
  .settings-page .lup-settings-list .lup-setting-date input { min-width:114px; font-size:11px; }
}
@media (prefers-reduced-motion:reduce) { .settings-page .lup-settings-list md-list-item.md-2-line { transition:none; } }

/* The course is a personal journey, not an admin dashboard. */
.course-page { position:relative; overflow:hidden; padding-top:18px; background:radial-gradient(circle at 92% 5%,rgba(127,105,231,.22),transparent 27%),radial-gradient(circle at 5% 36%,rgba(76,164,225,.10),transparent 23%),transparent; }
.course-page::before { content:''; position:absolute; top:95px; right:-49px; width:166px; height:166px; border:1px solid rgba(150,203,255,.10); border-radius:50%; box-shadow:0 0 0 24px rgba(124,98,220,.027),0 0 0 50px rgba(109,163,234,.018); pointer-events:none; }
.course-page > * { position:relative; z-index:1; }
.course-hero { min-height:82px; margin:0 0 12px; padding:14px 15px; border:1px solid rgba(175,208,255,.18); border-radius:20px; background:linear-gradient(118deg,rgba(44,61,97,.88),rgba(26,34,57,.91) 62%,rgba(46,35,80,.83)); box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 14px 26px rgba(0,0,0,.18); }
.course-hero-mark { flex-basis:54px; width:54px; height:54px; border-color:rgba(198,227,255,.45); border-radius:18px 18px 18px 7px; background:radial-gradient(circle at 30% 27%,rgba(213,242,255,.35),transparent 34%),linear-gradient(145deg,rgba(101,163,236,.82),rgba(111,76,182,.62)); box-shadow:inset 0 1px 0 rgba(255,255,255,.30),0 10px 19px rgba(22,31,83,.36),0 0 0 5px rgba(136,176,255,.07); }.course-hero-mark .material-icons { font-size:28px; }.course-hero small { color:#b9ddff; font-size:8px; }.course-hero h2 { margin:4px 0 3px; font-size:24px; font-weight:820; letter-spacing:-.045em; }.course-hero p { color:#c5cfe2; font-size:10px; }
.course-overview { gap:0; border-color:rgba(176,207,255,.15); border-radius:17px; background:rgba(8,13,26,.58); box-shadow:inset 0 1px 0 rgba(255,255,255,.065),0 11px 22px rgba(0,0,0,.12); }.course-overview > div { min-height:70px; padding:11px 12px; background:rgba(29,38,62,.74); }.course-overview > div + div { border-left:1px solid rgba(187,211,255,.10); }.course-overview strong { color:#eff7ff; font-size:24px; font-weight:820; letter-spacing:-.045em; }.course-overview span { color:#aebbd3; font-size:8px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }.course-overview .course-goal { border-top:1px solid rgba(187,211,255,.10); border-left:0; background:linear-gradient(105deg,rgba(81,132,211,.31),rgba(107,76,173,.25)); }.course-goal .material-icons { color:#d5ecff; font-size:19px; }.course-goal span { color:#e1eeff; font-size:9px; text-transform:none; }
.course-ranking-note { align-items:flex-start; gap:7px; margin:10px 5px 0; color:#a9b8d0; font-size:9px; }.course-ranking-note .material-icons { flex:0 0 auto; margin-top:-1px; color:#8ecfff; font-size:14px; }
.course-list-heading { align-items:center; margin:19px 4px 8px; }.course-list-heading h3 { color:#f3f7ff; font-size:17px; font-weight:780; letter-spacing:-.035em; white-space:nowrap; }.course-list-heading > span { color:#8fa5c7; font-size:8px; }
.course-timeline { margin-top:0; }.course-timeline::before { top:26px; bottom:26px; left:16px; background:linear-gradient(rgba(154,209,255,.55),rgba(122,104,223,.12)); }.course-stop { grid-template-columns:33px 46px minmax(0,1fr) 47px; gap:8px; min-height:82px; margin:8px 0; padding:9px 9px 9px 0; border-color:rgba(180,208,255,.14); border-radius:18px; background:linear-gradient(112deg,rgba(63,84,137,.24),rgba(22,29,47,.63) 66%); box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 9px 18px rgba(0,0,0,.10); }.course-stop:hover { transform:translateY(-2px) scale(1.008); border-color:rgba(173,214,255,.40); }.course-stop-pin { width:33px; height:33px; border-color:rgba(168,211,255,.36); background:linear-gradient(145deg,#293756,#202942); color:#bde5ff; }.course-stop-pin .material-icons { font-size:17px; }.course-stop-icon { width:46px; height:46px; border-radius:15px 15px 15px 6px; }.course-stop-icon .material-icons { font-size:23px; }.course-stop-main h3 { margin:2px 0 4px; font-size:13px; }.course-stop-main p { font-size:9px; }.course-stop-main small { font-size:7px; color:#b5d9ff; }.course-stop-count { min-width:47px; padding-left:5px; border-left-color:rgba(194,218,255,.11); }.course-stop-count strong { font-size:19px; }.course-stop-count span { color:#aabbd5; font-size:6px; }
@media (max-width:420px) { .course-page { padding:15px 12px 32px; }.course-hero { min-height:78px; padding:13px; border-radius:18px; }.course-hero-mark { flex-basis:48px; width:48px; height:48px; border-radius:16px 16px 16px 6px; }.course-hero-mark .material-icons { font-size:25px; }.course-hero h2 { font-size:22px; }.course-overview > div { min-height:65px; padding:10px; }.course-overview strong { font-size:22px; }.course-list-heading { margin-top:18px; }.course-list-heading h3 { font-size:15px; }.course-list-heading > span { display:none; }.course-stop { grid-template-columns:30px 42px minmax(0,1fr) 43px; gap:7px; min-height:78px; }.course-stop-pin { width:30px; height:30px; }.course-stop-icon { width:42px; height:42px; }.course-stop-icon .material-icons { font-size:21px; }.course-stop-count { min-width:43px; }.course-empty { border-style:solid; background:linear-gradient(145deg,rgba(47,62,99,.34),rgba(18,24,41,.53)); } }

/* Final responsive anchor: no later theme rule may move the two location
   actions when device emulation changes the available height. */
.nearby .roominfo .distrat {
  position:absolute;
  top:auto;
  right:auto;
  bottom:24px;
  left:50%;
  margin:0;
  transform:translateX(-50%);
}
.nearby .roominfo .distrat .location-cuddles,
.nearby .roominfo .distrat .distance {
  top:auto;
  right:auto;
  bottom:auto;
  left:auto;
  transform:none;
}

/* Profile section navigation: a quiet background rail with a moving active
   light. This uses Angular Material's own marker, so it follows the selected
   section without changing tab behaviour or content layout. */
.profile-page .information-tabs md-pagination-wrapper {
  position:relative;
  overflow:visible;
}
.profile-page .information-tabs md-pagination-wrapper::after {
  content:'';
  position:absolute;
  z-index:0;
  right:13%;
  bottom:9px;
  left:13%;
  height:1px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,rgba(149,163,226,.18) 16%,rgba(149,163,226,.34) 50%,rgba(149,163,226,.18) 84%,transparent);
  pointer-events:none;
}
.profile-page .information-tabs .md-ink-bar,
.profile-page .information-tabs [class*="ink-bar"] {
  display:block;
  visibility:visible;
  z-index:1;
  height:3px;
  margin-bottom:7px;
  border-radius:999px;
  background:linear-gradient(90deg,#71b8ee,#9a7ff0 48%,#d0a7fa);
  box-shadow:0 0 7px rgba(127,155,244,.46),0 0 17px rgba(122,92,255,.18);
  opacity:.9;
  transition:transform .28s cubic-bezier(.22,.78,.24,1),width .28s ease;
}

/* Final location-action contract: QR is a square scan surface, route is a
   true circle. Both counters use the same small, readable floating badge. */
.nearby .roominfo .distrat .location-cuddles { width:60px; min-width:60px; height:60px; border-radius:14px; }
.nearby .roominfo .distrat .distance,.nearby .roominfo .distrat .distance p,.nearby .roominfo .distrat .distance a { width:60px; min-width:60px; height:60px; margin:0; }
.nearby .roominfo .distrat .distance a { position:relative; display:grid; place-items:center; border-radius:50%; }
.nearby .roominfo .distrat .distance a > .material-icons { display:grid; place-items:center; width:60px; height:60px; margin:0; border-radius:50%; box-sizing:border-box; }
.nearby .roominfo .distrat .location-cuddles strong,.nearby .roominfo .distrat .distance a > span { display:grid; place-items:center; min-width:18px; height:18px; padding:0 4px; border:1px solid rgba(202,215,255,.32); border-radius:999px; background:rgba(26,29,45,.94); color:#faf9ff; box-shadow:0 2px 7px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.08); font-size:8px; font-weight:850; line-height:1; }

/* Profile navigation: two calm destinations, no moving rainbow or separate
   canvas behind the actual profile content. */
.profile-page .information-tabs md-pagination-wrapper::after,
.profile-page .information-tabs md-ink-bar,
.profile-page .information-tabs .md-ink-bar,
.profile-page .information-tabs [class*="ink-bar"] { display:none; visibility:hidden; }
.profile-page .information-tabs md-tabs-wrapper,
.profile-page .information-tabs md-tabs-canvas,
.profile-page .information-tabs md-pagination-wrapper { background:transparent; border:0; }
.profile-page .information-tabs md-tab-item { min-width:0; min-height:42px; margin:0 4px 8px; border:1px solid transparent; border-radius:12px; color:#aaa6ba; font-size:11px; font-weight:760; letter-spacing:.02em; text-transform:none; }
.profile-page .information-tabs md-tab-item.md-active { border-color:rgba(190,181,235,.22); background:rgba(255,255,255,.055); color:#f5f3fc; box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }
.profile-page .profile-information.profile-about-single { background:transparent; }

/* The two profile sections stay recognisable even when a narrow display
   cannot carry their labels: person and camera, joined only by a fixed line. */
.profile-page .information-tabs md-tab-item { position:relative; display:flex; align-items:center; justify-content:center; gap:0; margin:0 4px 8px; border:0; background:transparent; box-shadow:none; transition:none; }
.profile-page .information-tabs md-tab-item .md-tab-label { display:flex; align-items:center; justify-content:center; font-size:0; }

/* Discovery card, v2: one place, one clear next action.  The carousel owns
   horizontal motion; this layer only gives the current card depth and a calm
   category-coloured signal. */
.nearby .placeboard {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:390px;
  border:1px solid color-mix(in srgb,var(--lup-place-accent,#78bfff) 30%,rgba(211,229,255,.12));
  border-radius:24px;
  background:
    radial-gradient(ellipse 74% 44% at 15% -7%,color-mix(in srgb,var(--lup-place-glow,#5ca8ff) 20%,transparent),transparent 72%),
    radial-gradient(ellipse 44% 32% at 100% 100%,color-mix(in srgb,var(--lup-place-accent,#8c75ec) 13%,transparent),transparent 76%),
    linear-gradient(148deg,rgba(31,43,72,.96),rgba(13,20,37,.98) 68%,rgba(12,17,31,.99));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 18px 38px rgba(0,0,0,.25);
}
.nearby .placeboard::before {
  content:'';
  position:absolute;
  z-index:-1;
  top:-76px;
  right:-72px;
  width:210px;
  height:210px;
  border:1px solid color-mix(in srgb,var(--lup-place-accent,#8dc9ff) 28%,transparent);
  border-radius:50%;
  box-shadow:0 0 0 29px color-mix(in srgb,var(--lup-place-accent,#8dc9ff) 5%,transparent),0 0 0 63px color-mix(in srgb,var(--lup-place-accent,#8dc9ff) 3%,transparent);
  pointer-events:none;
}
.nearby .placeboard .room-category-hero {
  min-height:173px;
  padding:25px 25px 20px;
  border:0;
  background:transparent;
  box-shadow:none;
}
.nearby .placeboard .room-category-orbit {
  width:62px;
  height:62px;
  margin:0 0 15px;
  border-color:color-mix(in srgb,var(--lup-place-accent,#9bd8ff) 47%,rgba(255,255,255,.2));
  background:linear-gradient(145deg,color-mix(in srgb,var(--lup-place-accent,#78bfff) 49%,rgba(255,255,255,.12)),rgba(24,31,57,.62));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.26),0 11px 25px color-mix(in srgb,var(--lup-place-glow,#559fff) 25%,transparent);
}
.nearby .placeboard .room-category-orbit .material-icons { font-size:30px; }
.nearby .placeboard .room-category-name {
  color:color-mix(in srgb,var(--lup-place-accent,#a7d9ff) 78%,#edf5ff);
  font-size:9px;
  font-weight:850;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.nearby .placeboard .room-hero-name {
  display:-webkit-box;
  overflow:hidden;
  max-width:100%;
  margin:5px 0 7px;
  color:#f5f8ff;
  font-size:clamp(24px,7vw,34px);
  font-weight:780;
  letter-spacing:-.055em;
  line-height:.98;
  text-shadow:0 5px 20px rgba(0,0,0,.20);
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.nearby .placeboard .room-hero-meta { color:#b8c8dc; font-size:11px; }
.nearby .placeboard .room-hero-meta .material-icons { margin-right:4px; color:var(--lup-place-accent,#9bd8ff); font-size:15px; vertical-align:-3px; }
.nearby .placeboard .room-user-preview {
  position:absolute;
  right:21px;
  bottom:101px;
  left:21px;
  display:flex;
  align-items:center;
  min-height:46px;
  margin:0;
  padding:9px 11px;
  border-top:1px solid rgba(213,229,255,.12);
  border-radius:0;
  background:rgba(6,11,24,.14);
}
.nearby .placeboard .room-user-preview::after { content:'Live vor Ort'; margin-left:auto; color:#9eafc8; font-size:9px; font-weight:780; letter-spacing:.04em; }
.nearby .placeboard .room-presence-count { margin:0 0 0 8px; }
.nearby .placeboard .distrat { bottom:25px; gap:11px; }
@keyframes lup-placeboard-arrive { from { opacity:.74; transform:translateY(5px) scale(.992); } to { opacity:1; transform:translateY(0) scale(1); } }
@media (max-width:390px) {
  .nearby .placeboard { min-height:365px; border-radius:20px; }
  .nearby .placeboard .room-category-hero { min-height:158px; padding:20px 20px 16px; }
  .nearby .placeboard .room-category-orbit { width:55px; height:55px; margin-bottom:12px; }
  .nearby .placeboard .room-hero-name { font-size:clamp(23px,7.2vw,30px); }
  .nearby .placeboard .room-user-preview { right:17px; bottom:94px; left:17px; }
  .nearby .placeboard .room-user-preview::after { display:none; }
  .nearby .placeboard .distrat { bottom:18px; }
}
.profile-page .information-tabs md-tab-item::before { display:none; content:none; }
.profile-page .information-tabs md-tab-item .md-tab-label::before { font-family:'Material Icons'; font-size:19px; line-height:1; color:#8d899d; transition:none; }
.profile-page .information-tabs md-tab-item:first-child .md-tab-label::before { content:'short_text'; }
.profile-page .information-tabs md-tab-item:nth-child(2) .md-tab-label::before { content:'photo_camera'; }
.profile-page .information-tabs md-tab-item::after { display:none; content:none; }
.profile-page .information-tabs md-tab-item.md-active { border:0; background:transparent; box-shadow:none; }
.profile-page .information-tabs md-tab-item.md-active .md-tab-label::before { color:#f4f1ff; text-shadow:0 0 7px rgba(214,207,255,.24); }
.profile-page .information-tabs .profile-tab-copy { display:none; }
.profile-page .information-tabs .profile-tab-icon { display:block; margin:0; color:#8d899d; font-size:20px; line-height:1; }
.profile-page .information-tabs md-tab-item.md-active .profile-tab-icon { color:#f4f1ff; text-shadow:0 0 7px rgba(214,207,255,.24); }

/* Stable fallback: Angular renders these labels itself, so never hide them. */
.profile-page .information-tabs md-tab-item .md-tab-label { display:block; font-family:'Material Icons'; font-size:20px; line-height:1; color:#aaa6ba; }
.profile-page .information-tabs md-tab-item .md-tab-label::before { display:none; content:none; }
.profile-page .information-tabs md-tab-item.md-active .md-tab-label { color:#f4f1ff; }

/* Stable profile switch: visible controls live outside Angular Material's
   legacy tab header, while the original tabs continue to own the content. */
.profile-page .profile-section-switch { display:flex; align-items:center; justify-content:space-between; width:min(100% - 34px,260px); margin:2px auto 10px; }
.profile-page .profile-section-switch button { display:grid; place-items:center; width:42px; height:38px; padding:0; border:0; border-radius:11px; background:transparent; color:#898596; cursor:pointer; }
.profile-page .profile-section-switch button .material-icons { font-size:20px; line-height:1; }
.profile-page .profile-section-switch button.active { color:#f5f3fc; }
.profile-page .profile-section-switch button.active .material-icons { text-shadow:0 0 7px rgba(213,205,255,.25); }
.profile-page .information-tabs > md-tabs-wrapper { display:block; }

/* The legacy mobile rule pulled the tab row up beneath the statistic card.
   Keep the actual choices as a visible row directly above their content. */
@media (max-width:768px) {
  .profile-page .information-tabs { position:relative; top:0; margin:0; }
  .profile-page .information-tabs md-tabs-canvas,
  .profile-page .information-tabs md-pagination-wrapper { height:50px; }
  .profile-page .information-tabs md-tab-item { display:flex; align-items:center; justify-content:center; height:50px; min-height:50px; margin:2px 7px; border:0; border-radius:18px; background:transparent; box-shadow:none; line-height:1; }
  .profile-page .information-tabs md-tab-item.md-active { border:0; background:transparent; box-shadow:none; }
  .profile-page .information-tabs md-tab-item .md-tab-label { display:block; font-family:inherit; font-size:11px; line-height:50px; color:#f4f1fb; text-shadow:none; transition:none; }
  .profile-page .information-tabs md-tab-item[aria-selected="true"] .md-tab-label { color:#f4f1fb; text-shadow:none; }
  .profile-page .information-tabs md-tab-item .md-tab-label { visibility:visible; opacity:1; white-space:nowrap; }
  /* Angular replaces its label nodes while switching. These two captions are
     attached to the stable click surfaces and therefore never disappear. */
  .profile-page .information-tabs md-tab-item .md-tab-label { font-size:0; }
  .profile-page .information-tabs md-tab-item::after { position:absolute; display:block; top:50%; left:50%; width:auto; height:auto; transform:translate(-50%,-50%); background:transparent; color:#f4f1fb; font-family:Ubuntu,Roboto,Arial,sans-serif; font-size:11px; font-weight:720; line-height:1; white-space:nowrap; pointer-events:none; }
  .profile-page .information-tabs md-tab-item:first-child::after { content:'Über mich'; }
  .profile-page .information-tabs md-tab-item:nth-child(2)::after { content:'Galerie'; }
}


/* “All locations” is an overview control, so the filled grid can speak for
   itself without squeezing a redundant label under the icon. */
.nearby .location-categories button:first-child span { display:grid; min-height:17px; margin-top:4px; visibility:hidden; }
.nearby .location-categories button:first-child { min-height:56px; padding:4px 1px 3px; border-width:1px; border-radius:10px; }
.nearby .location-categories button:first-child .material-icons { width:30px; height:30px; border:1px solid color-mix(in srgb,var(--lup-category-ink) 32%,transparent); border-radius:10px 10px 10px 5px; background:linear-gradient(145deg,color-mix(in srgb,var(--lup-category-ink) 14%,#424454),rgba(21,23,35,.78)); box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 5px 11px rgba(0,0,0,.20); color:var(--lup-category-ink); font-size:18px; line-height:1; opacity:1; }
.nearby .location-categories button:first-child.active .material-icons { transform:none; border-color:color-mix(in srgb,var(--lup-category-ink) 32%,transparent); background:linear-gradient(145deg,color-mix(in srgb,var(--lup-category-ink) 14%,#424454),rgba(21,23,35,.78)); box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 5px 11px rgba(0,0,0,.20); color:var(--lup-category-ink); }
.nearby .location-categories button:first-child,
.nearby .location-categories button:first-child { display:flex; visibility:visible; opacity:1; border-color:rgba(255,255,255,.10); background:transparent; box-shadow:none; }
.nearby .location-categories button:first-child.active { display:flex; visibility:visible; opacity:1; border:1px solid rgba(194,180,255,.48); background:linear-gradient(145deg,rgba(155,132,238,.15),rgba(255,255,255,.025)); box-shadow:0 0 0 1px rgba(171,151,244,.13),0 0 15px rgba(144,116,234,.24),inset 0 1px 0 rgba(255,255,255,.18); }

/* In the unrestricted “All” filter the current card must not impersonate its
   category in the selector rail. The active frame belongs to All itself. */
.nearby md-content.greybg:has(.location-categories button:first-child.active) .location-categories button:not(:first-child) { border-color:transparent; background:linear-gradient(160deg,rgba(255,255,255,.028),rgba(255,255,255,0)); box-shadow:none; }
.nearby md-content.greybg:has(.location-categories button:first-child.active) .location-categories button:first-child { border:1px solid rgba(194,180,255,.48); background:linear-gradient(145deg,rgba(155,132,238,.15),rgba(255,255,255,.025)); box-shadow:0 0 0 1px rgba(171,151,244,.13),0 0 15px rgba(144,116,234,.24),inset 0 1px 0 rgba(255,255,255,.18); }

/* One restrained active intensity for every category icon. */
.nearby .location-categories button.active .material-icons { box-shadow:0 0 8px color-mix(in srgb,var(--lup-category-ink) 18%,transparent),inset 0 1px 0 rgba(255,255,255,.24),0 5px 11px rgba(0,0,0,.20); }
.nearby .location-categories button:first-child.active .material-icons { box-shadow:0 0 8px color-mix(in srgb,var(--lup-category-ink) 18%,transparent),inset 0 1px 0 rgba(255,255,255,.24),0 5px 11px rgba(0,0,0,.20); }

/* Location / Chat / Online: one composed segmented control instead of three
   competing cards. This keeps the navigation compact on a phone and clear on
   desktop. */
.location-page md-tabs { background:transparent; }
/* One rail, three equal segments: only the selected segment receives a fill.
   This intentionally removes the legacy Material second border and ink bar. */
.location-page md-tabs md-tabs-wrapper { overflow:hidden; margin:0 0 5px; padding:0; border:0; border-radius:0; background:rgba(23,25,39,.94); box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 7px 16px rgba(0,0,0,.16); }
.location-page md-tabs md-tabs-canvas,.location-page md-tabs md-pagination-wrapper { height:46px; background:transparent; border:0; }
.location-page md-tabs md-tab-item { min-width:0; min-height:46px; height:46px; margin:0; border:0; border-radius:0; background:transparent; box-shadow:none; color:#aaa6ba; }
.location-page md-tabs md-tab-item + md-tab-item { border-left:0; }
.location-page md-tabs md-tab-item .md-tab-label { gap:5px; font-size:10px; font-weight:780; letter-spacing:.025em; }
.location-page md-tabs md-tab-item .md-tab-label::before { width:24px; height:24px; border-radius:8px; background:rgba(255,255,255,.045); color:#aaa6ba; font-size:16px; }
.location-page md-tabs md-tab-item.md-active { background:linear-gradient(135deg,rgba(133,108,231,.31),rgba(92,136,208,.18)); color:#f8f6ff; box-shadow:inset 0 1px 0 rgba(255,255,255,.13); }
.location-page md-tabs md-tab-item:first-child,
.location-page md-tabs md-tab-item:last-child { border-radius:0; }
.location-page md-tabs md-prev-button,
.location-page md-tabs md-next-button { display:none; }

/* The place detail is a venue card: calm depth, clear identity, no empty
   technical surface. */
.location-experience { position:relative; isolation:isolate; background:radial-gradient(circle at 84% 4%,rgba(111,143,240,.12),transparent 27%),linear-gradient(180deg,#1b1d30 0%,#151623 100%); }
.location-experience::after { content:''; position:absolute; z-index:-1; right:-88px; bottom:78px; width:230px; height:230px; border:1px solid rgba(145,122,238,.11); border-radius:50%; box-shadow:0 0 0 32px rgba(111,95,204,.025),0 0 56px rgba(75,151,232,.07); }
.location-hero { min-height:224px; border-bottom:1px solid rgba(193,185,244,.11); }
.location-hero-copy { bottom:18px; }
.location-identity { display:flex; align-items:center; gap:6px; margin-top:10px; color:#d9d4e8; font-size:10px; font-weight:720; letter-spacing:.04em; text-transform:uppercase; }
.location-identity .material-icons { color:var(--location-accent); font-size:15px; text-shadow:0 0 10px var(--location-glow); }
.location-identity b { width:3px; height:3px; border-radius:50%; background:rgba(216,210,237,.58); }

/* A living place atmosphere: slow ambient light gives the location page depth
   without competing with the venue information or chat controls. */
.location-experience { overflow:hidden; }
.location-experience::before { content:''; position:absolute; z-index:0; top:30%; left:-38%; width:176%; height:54%; pointer-events:none; background:radial-gradient(ellipse at 24% 55%,rgba(141,107,245,.18),transparent 31%),radial-gradient(ellipse at 76% 45%,rgba(73,171,240,.13),transparent 32%),radial-gradient(ellipse at 52% 90%,rgba(232,130,211,.075),transparent 29%); filter:blur(3px); animation:lup-location-ambient 16s ease-in-out infinite alternate; }
.location-experience::after { z-index:0; animation:lup-location-orbit 20s linear infinite; }
.location-experience > * { position:relative; z-index:1; }
.location-hero-art .material-icons { animation:lup-location-icon-pulse 5.5s ease-in-out infinite; }
@keyframes lup-location-ambient { 0% { transform:translate3d(-4%,-2%,0) scale(.97); opacity:.56; } 50% { transform:translate3d(4%,3%,0) scale(1.05); opacity:.92; } 100% { transform:translate3d(1%,-4%,0) scale(1); opacity:.66; } }
@keyframes lup-location-orbit { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }
@keyframes lup-location-icon-pulse { 0%,100% { opacity:.28; filter:brightness(1); } 50% { opacity:.38; filter:brightness(1.18); } }
@keyframes lup-room-ambient {
  0% { background-position:0% 8%; }
  50% { background-position:74% 58%; }
  100% { background-position:22% 100%; }
}

/* The whole discovery view gets its own quiet motion language: a slow signal
   path and drifting points sit behind the cards, like a live map at night. */
.nearby md-content.greybg { position:relative; isolation:isolate; }
.nearby md-content.greybg::before { opacity:.30; background-size:17px 17px; animation:lup-discovery-points 22s linear infinite; }
.nearby md-content.greybg::after { content:''; position:fixed; z-index:0; left:-42vw; bottom:-31vh; width:184vw; height:72vh; pointer-events:none; border:1px solid rgba(164,143,255,.16); border-radius:50%; background:radial-gradient(ellipse at 50% 50%,transparent 54%,rgba(122,180,245,.045) 55%,transparent 60%); box-shadow:0 0 0 27px rgba(122,92,255,.018),0 0 0 58px rgba(91,172,240,.014),0 0 52px rgba(133,108,236,.16); transform-origin:50% 65%; animation:lup-discovery-signal 17s ease-in-out infinite alternate; }
@keyframes lup-discovery-points { from { background-position:0 0; } to { background-position:34px 51px; } }
@keyframes lup-discovery-signal { 0% { transform:translate3d(-3%,2%,0) rotate(-2deg) scale(.96); opacity:.38; } 52% { transform:translate3d(3%,-3%,0) rotate(2deg) scale(1.04); opacity:.78; } 100% { transform:translate3d(1%,2%,0) rotate(-1deg) scale(1); opacity:.48; } }
@media (prefers-reduced-motion:reduce) { .nearby md-content.greybg::before,.nearby md-content.greybg::after { animation:none; } }

/* About is part of the profile, not a separate blue feature card. */
.profile-page .profile-information.profile-about-single { padding:8px 12px 24px; background:transparent; }
.profile-page .profile-information.profile-about-single .profile-story-card { min-height:142px; padding:18px 17px 20px; border:1px solid rgba(208,201,235,.12); border-radius:17px; background:linear-gradient(145deg,rgba(40,41,61,.84),rgba(23,25,39,.94)); box-shadow:inset 0 1px 0 rgba(255,255,255,.065),0 13px 25px rgba(0,0,0,.17); }
.profile-page .profile-information.profile-about-single .profile-story-card::before,
.profile-page .profile-information.profile-about-single .profile-story-card::after { display:none; }
.profile-page .profile-information.profile-about-single .profile-story-card h5 { position:relative; display:flex; align-items:center; min-height:26px; margin:0 0 14px; padding:0 0 10px 12px; border:0; border-bottom:1px solid rgba(208,201,235,.10); color:#e9e5f5; font-size:10px; font-weight:800; letter-spacing:.1em; text-shadow:none; }
.profile-page .profile-information.profile-about-single .profile-story-card h5::before { content:''; position:absolute; left:0; width:4px; height:4px; border-radius:50%; background:#afa1db; box-shadow:0 0 8px rgba(175,161,219,.6); }
.profile-page .profile-information.profile-about-single .profile-story-card h5 .material-icons { display:none; }
.profile-page .profile-information.profile-about-single .profile-about-me { color:#ded9e8; font-size:14px; font-weight:500; line-height:1.58; text-shadow:none; }
.profile-page .profile-information.profile-about-single .profile-about-empty { margin:15px 0 0; padding-left:0; color:#aaa5ba; font-size:14px; }.profile-page .profile-information.profile-about-single .profile-about-empty::before { display:none; }

/* Chromium lays out the old floated statistics card outside the profile flow.
   Keep the profile header, stats, actions and section tabs as normal blocks so
   none of them can cover the avatar or each other. */
.profile-page .avatar-bg { min-height:286px; }
.profile-page .user-top-information { float:none; left:auto; right:auto; margin:-57px auto 0; }
.profile-page .profile-actions { clear:both; width:auto; min-height:48px; margin:16px auto 10px; position:relative; text-align:center; }
.profile-page .profile-actions .content-center { display:inline-flex; align-items:center; justify-content:center; }
.profile-page .profile-section-nav { clear:both; }

/* Keep the VIP room action discoverable, but do not disable its click: the
 * handler explains the requirement to non-VIP users. */
.lup-vip-locked { opacity: .42; }

/* About can be completely editorial: no separate card, simply the person's
   words on the same calm profile surface. */
.profile-page .profile-information.profile-about-single .profile-story-card { min-height:0; padding:12px 4px 16px; border:0; border-radius:0; background:transparent; box-shadow:none; overflow:visible; }
.profile-page .profile-information.profile-about-single .profile-story-card h5 { margin-bottom:11px; padding-bottom:8px; border-bottom-color:rgba(208,201,235,.08); }
.profile-page .profile-information.profile-about-single { max-width:620px; padding:16px 20px 30px; }
.profile-page .profile-information.profile-about-single .profile-story-card h5 { min-height:20px; margin:0 0 13px; padding:0 0 10px 11px; color:#bdb7cf; font-size:9px; font-weight:780; letter-spacing:.14em; }
.profile-page .profile-information.profile-about-single .profile-story-card h5::before { width:3px; height:3px; background:#a99bce; box-shadow:none; }
.profile-page .profile-information.profile-about-single .profile-about-me { max-width:500px; color:#e4e0ec; font-size:15px; font-weight:450; line-height:1.68; letter-spacing:.004em; }
.profile-page .profile-information.profile-about-single .profile-about-empty { max-width:360px; color:#aaa5ba; font-size:14px; line-height:1.55; }
.profile-page .profile-information.profile-about-single .profile-about-empty { display:grid; justify-items:start; gap:10px; }
.profile-page .profile-information.profile-about-single .profile-about-empty p { margin:0; }
.profile-page .profile-information.profile-about-single .profile-about-empty button { display:inline-flex; align-items:center; gap:6px; min-height:34px; padding:0 11px; border:1px solid rgba(171,205,244,.22); border-radius:10px; background:rgba(109,151,211,.10); color:#cce8ff; font:700 11px/1 Ubuntu,Roboto,Arial,sans-serif; cursor:pointer; }
.profile-page .profile-information.profile-about-single .profile-about-empty button .material-icons { font-size:15px; }
.profile-page .profile-information.profile-about-single .profile-about-empty button:hover,.profile-page .profile-information.profile-about-single .profile-about-empty button:focus-visible { border-color:rgba(180,218,255,.48); background:rgba(110,164,224,.18); outline:0; }

/* Stable profile navigation. The legacy Material header remains responsible
   for panels only; these two visible controls are the sole visual navigation. */
.profile-page .profile-section-nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:3px; width:calc(100% - 24px); margin:14px 12px 10px; padding:3px; box-sizing:border-box; border:1px solid rgba(193,184,236,.12); border-radius:15px; background:rgba(18,20,33,.73); box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 9px 18px rgba(0,0,0,.14); }
.profile-page .profile-section-nav button { display:flex; align-items:center; justify-content:center; gap:7px; min-width:0; height:43px; padding:0 8px; border:0; border-radius:11px; background:transparent; color:#aaa5b9; font:760 12px/1 Ubuntu,Roboto,Arial,sans-serif; letter-spacing:.01em; cursor:pointer; transition:background .18s ease,color .18s ease,box-shadow .18s ease; }
.profile-page .profile-section-nav button .material-icons { font-size:19px; color:#a49cc2; }
.profile-page .profile-section-nav button.active { background:linear-gradient(135deg,rgba(132,107,230,.31),rgba(76,139,207,.15)); color:#fbf9ff; box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 3px 10px rgba(0,0,0,.16); }
.profile-page .profile-section-nav button.active .material-icons { color:#e5ddff; text-shadow:0 0 10px rgba(185,165,255,.38); }
.profile-page .information-tabs > md-tabs-wrapper { display:none; }
.profile-page .information-tabs { top:0; margin:0; }

/* Profile actions use the same compact control language as the online list:
   a person is contacted, added or removed through one unmistakable symbol.
   The action state changes, the position does not. */
.profile-page .profile-actions {
  margin:14px auto 10px;
}
.profile-page .profile-actions .content-center {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:5px;
  border:1px solid rgba(185,197,235,.11);
  border-radius:16px;
  background:rgba(16,19,32,.58);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055);
}
.profile-page .profile-social-action {
  display:grid;
  place-items:center;
  width:39px;
  height:39px;
  margin:0;
  padding:0;
  border:1px solid rgba(185,197,235,.14);
  border-radius:12px;
  background:rgba(255,255,255,.045);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.075);
  color:#dce4fb;
  cursor:pointer;
  transition:transform 160ms ease,background-color 160ms ease,border-color 160ms ease,box-shadow 160ms ease;
}
.profile-page .profile-social-action .material-icons { font-size:19px; color:currentColor; }
.profile-page .profile-social-action:hover,
.profile-page .profile-social-action:focus-visible {
  transform:translateY(-2px);
  outline:0;
}
.profile-page .profile-social-action:focus-visible { box-shadow:0 0 0 3px rgba(155,181,255,.2); }
.profile-page .profile-social-up { color:#ffe09a; border-color:rgba(248,201,100,.27); background:rgba(239,177,73,.12); }
.profile-page .profile-social-friend { color:#d8ceff; border-color:rgba(172,151,255,.3); background:rgba(130,104,224,.15); }
.profile-page .profile-social-pending { color:#ffe0a5; border-color:rgba(242,190,94,.28); background:rgba(213,151,58,.13); }
.profile-page .profile-social-remove { color:#ffbdca; border-color:rgba(255,139,162,.25); background:rgba(211,83,112,.12); }
.profile-page .profile-social-message { color:#c3ddff; border-color:rgba(118,174,239,.29); background:rgba(68,132,212,.14); }
.profile-page .profile-social-action:hover { border-color:rgba(232,239,255,.52); background:rgba(159,181,237,.19); }
@media (prefers-reduced-motion: reduce) { .profile-page .profile-social-action { transition:none; } }

/* Foreign-profile controls live inside the five profile markers, not as a
   separate row.  This keeps the social decision close to its context. */
.profile-page .user-top-information .countitems { grid-template-columns:repeat(4,minmax(0,1fr)); }
.profile-page:not(.has-own-user) .user-top-information .countitems { grid-template-columns:repeat(5,minmax(0,1fr)); gap:7px; padding-left:9px; padding-right:9px; }
.profile-page:not(.has-own-user) .user-top-information .countitem { min-width:0; min-height:102px; padding-left:3px; padding-right:3px; }
.profile-page:not(.has-own-user) .user-top-information .countitem .item { font-size:.53rem; letter-spacing:.025em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.profile-page:not(.has-own-user) .profile-stat-pull.stat-friends { cursor:ns-resize; }
.profile-page .user-top-information .stat-message { border-color:rgba(255,132,174,.30); background:linear-gradient(150deg,rgba(243,79,137,.21),rgba(172,56,103,.09)); }
.profile-page .user-top-information .stat-message::before { background:#ff92bd; color:#ff92bd; }
.profile-page .user-top-information .stat-message .profile-stat-pull-lever { background:linear-gradient(145deg,#f477aa,#b94980); box-shadow:0 8px 0 rgba(129,39,77,.42),0 14px 22px rgba(0,0,0,.23),inset 0 1px 0 rgba(255,255,255,.34); }
.profile-page .user-top-information .stat-message { cursor:ns-resize; }
.profile-page .user-top-information .stat-message .profile-stat-pull-lever { margin-bottom:8px; }
.profile-page .user-top-information .stat-message .item { color:#ffe2ec; }
.profile-page .profile-stat-pull.is-friend-gesture::before { animation:lup-friend-cord-break 460ms cubic-bezier(.2,.92,.26,1); }
.profile-page .profile-stat-pull.is-friend-gesture .profile-stat-pull-lever { animation:lup-friend-latch 460ms cubic-bezier(.2,.92,.26,1); }
.profile-page .profile-stat-pull.is-message-gesture::before { background:linear-gradient(to bottom,rgba(255,195,216,.95),rgba(239,89,145,.25)); box-shadow:0 0 13px rgba(248,108,162,.58); }
.profile-page .profile-stat-pull.is-message-gesture .profile-stat-pull-lever { filter:brightness(1.12); }

/* Profile collection markers: a consistent translucent, lifted control set.
   The message control keeps an invisible value line so all five markers share
   the exact same vertical rhythm. */
.profile-page .user-top-information .countitem {
  border-color:rgba(211,222,255,.17);
  background:linear-gradient(145deg,rgba(255,255,255,.135),rgba(255,255,255,.035) 44%,rgba(30,37,65,.12));
  box-shadow:0 11px 23px rgba(2,7,22,.22),inset 0 1px 0 rgba(255,255,255,.20),inset 0 -1px 0 rgba(12,16,34,.26);
}
.profile-page .user-top-information .countitem::after { opacity:.18; filter:blur(16px); }
.profile-page .profile-stat-pull .profile-stat-pull-lever,
.profile-page .user-top-information .stat-message .profile-stat-pull-lever {
  width:43px;
  height:43px;
  margin:0 0 6px;
  border:1px solid rgba(239,246,255,.39);
  border-radius:15px;
  box-shadow:0 7px 0 rgba(34,44,91,.44),0 14px 22px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.44),inset 0 -7px 14px rgba(12,22,64,.14);
}
.profile-page .profile-stat-pull .profile-stat-pull-lever::before,
.profile-page .user-top-information .stat-message .profile-stat-pull-lever::before {
  content:'';
  position:absolute;
  top:4px;
  left:7px;
  right:7px;
  height:9px;
  border-radius:50%;
  background:linear-gradient(180deg,rgba(255,255,255,.36),rgba(255,255,255,0));
  pointer-events:none;
}
.profile-page .user-top-information .countitem .count-spacer { visibility:hidden; }
.profile-page .user-top-information .stat-message .item { margin-top:1px; }
.profile-page .user-top-information .countitem:hover {
  border-color:rgba(227,238,255,.32);
  background:linear-gradient(145deg,rgba(255,255,255,.18),rgba(255,255,255,.055) 44%,rgba(46,62,113,.15));
  box-shadow:0 13px 27px rgba(2,7,22,.27),inset 0 1px 0 rgba(255,255,255,.25),inset 0 -1px 0 rgba(12,16,34,.26);
}
@media (max-width:380px) {
  .profile-page:not(.has-own-user) .profile-stat-pull .profile-stat-pull-lever,
  .profile-page:not(.has-own-user) .user-top-information .stat-message .profile-stat-pull-lever { width:35px; height:35px; margin-bottom:6px; border-radius:12px; }
}
@keyframes lup-friend-cord-break { 0%,38% { opacity:1; transform:translateX(-50%) scaleY(1); } 49% { opacity:1; transform:translateX(-50%) scaleY(.78); } 58% { opacity:.1; transform:translateX(-50%) scaleY(.42); } 75% { opacity:.78; transform:translateX(-50%) scaleY(.9); } 100% { opacity:.9; transform:translateX(-50%) scaleY(1); } }
@keyframes lup-friend-latch { 0% { transform:translate3d(0,33px,0); } 42% { transform:translate3d(0,42px,0) rotate(0deg); } 58% { transform:translate3d(0,30px,0) rotate(-4deg); } 78% { transform:translate3d(0,6px,0) rotate(2deg); } 100% { transform:translate3d(0,0,0) rotate(0deg); } }
@media (max-width:380px) { .profile-page:not(.has-own-user) .user-top-information .countitems { gap:4px; padding-left:5px; padding-right:5px; } .profile-page:not(.has-own-user) .user-top-information .countitem { min-height:94px; } .profile-page:not(.has-own-user) .user-top-information .countitem .item { font-size:.47rem; } .profile-page:not(.has-own-user) .profile-stat-pull .profile-stat-pull-lever { width:35px; height:35px; border-radius:12px; } .profile-page:not(.has-own-user) .profile-stat-pull .profile-stat-pull-lever .material-icons { font-size:20px; } }

/* Friends and received Ups use the same small action grammar as a profile:
   violet opens a conversation, rose is reserved for a deliberate removal. */
.lup-user-actions {
  display:flex;
  align-items:center;
  gap:5px;
  margin-left:8px;
}
.lup-user-action {
  display:grid;
  place-items:center;
  width:33px;
  height:33px;
  padding:0;
  border:1px solid rgba(185,197,235,.14);
  border-radius:10px;
  background:rgba(255,255,255,.045);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
  color:#dce4fb;
  cursor:pointer;
  transition:transform 160ms ease,filter 160ms ease,border-color 160ms ease;
}
.lup-user-action .material-icons { font-size:17px; color:currentColor; }
.lup-user-action:hover,
.lup-user-action:focus-visible { transform:translateY(-1px); filter:brightness(1.15); outline:0; }
.lup-user-action:focus-visible { box-shadow:0 0 0 3px rgba(155,181,255,.2); }
.lup-user-action-message { color:#c8dfff; border-color:rgba(118,174,239,.29); background:rgba(68,132,212,.14); }
.lup-user-action-remove { color:#ffbdca; border-color:rgba(255,139,162,.25); background:rgba(211,83,112,.12); }
@media (prefers-reduced-motion: reduce) { .lup-user-action { transition:none; } }

/* The yellow Up marker is a small pull mechanism, not a third button below
   the profile. Dragging the shared-moment marker gives one intentional Up and
   it returns to its normal resting position after the server request settles. */
.profile-page .user-top-information .profile-up-pull {
  appearance:none;
  -webkit-appearance:none;
  touch-action:none;
  user-select:none;
  -webkit-user-select:none;
  cursor:ns-resize;
  border-color:rgba(246,198,90,.34);
  outline:0;
}
.profile-page .user-top-information .profile-up-pull:hover { transform:none; }
.profile-page .profile-up-pull .profile-up-pull-lever {
	position:relative;
  display:grid;
  place-items:center;
  width:43px;
  height:43px;
  margin:0 0 6px;
  border:1px solid rgba(255,236,174,.38);
  border-radius:15px;
  background:linear-gradient(145deg,#f3c65d,#cf8351);
  box-shadow:0 8px 0 rgba(133,76,38,.42),0 14px 22px rgba(0,0,0,.23),inset 0 1px 0 rgba(255,255,255,.34);
  color:#fff5c5;
  transform:translate3d(0,var(--lup-up-pull,0px),0);
  transition:transform 180ms cubic-bezier(.2,.8,.25,1),box-shadow 180ms ease,filter 180ms ease;
}
.profile-page .profile-up-pull .profile-up-pull-lever::after {
  content:'';
  position:absolute;
  width:3px;
  height:15px;
  margin-top:-31px;
  border-radius:3px;
  background:rgba(255,223,135,.46);
  box-shadow:0 0 8px rgba(255,208,93,.34);
  opacity:.45;
}
.profile-page .profile-up-pull .profile-up-pull-lever .material-icons { margin:0; color:inherit; font-size:24px; text-shadow:0 1px 0 rgba(101,53,22,.25); }
.profile-page .profile-up-pull.is-pulling .profile-up-pull-lever { box-shadow:0 3px 0 rgba(133,76,38,.42),0 8px 15px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.34); filter:brightness(1.06); }
.profile-page .profile-up-pull.is-released .profile-up-pull-lever { animation:lup-up-lever-lock 460ms cubic-bezier(.2,.92,.26,1); }
.profile-page .profile-up-pull.is-working .profile-up-pull-lever { filter:saturate(1.08) brightness(1.08); }
@keyframes lup-up-lever-lock {
  0% { transform:translate3d(0,33px,0); }
  24% { transform:translate3d(0,39px,0); }
  49% { transform:translate3d(0,22px,0); }
  72% { transform:translate3d(0,4px,0); }
  100% { transform:translate3d(0,0,0); }
}
@media (max-width:380px) {
  .profile-page .profile-up-pull .profile-up-pull-lever { width:38px; height:38px; border-radius:13px; }
  .profile-page .profile-up-pull .profile-up-pull-lever .material-icons { font-size:21px; }
}
@media (prefers-reduced-motion:reduce) {
  .profile-page .profile-up-pull .profile-up-pull-lever { transition:none; }
  .profile-page .profile-up-pull.is-released .profile-up-pull-lever { animation:none; }
}

/* All four profile values now share the same deliberate pull language. Their
   colour still describes the destination; the physical motion stays familiar. */
.profile-page .user-top-information .profile-stat-pull {
  appearance:none;
  -webkit-appearance:none;
  touch-action:none;
  user-select:none;
  -webkit-user-select:none;
  cursor:ns-resize;
  outline:0;
  font:inherit;
}
.profile-page .user-top-information .profile-stat-pull:hover { transform:none; }
.profile-page .user-top-information .profile-stat-pull::before {
  top:8px;
  right:auto;
  left:50%;
  width:2px;
  height:calc(15px + var(--lup-up-pull,0px));
  transform:translateX(-50%);
  border-radius:3px;
  background:linear-gradient(to bottom,rgba(227,232,255,.78),rgba(164,180,235,.30));
  box-shadow:0 0 7px rgba(161,190,255,.24);
  color:transparent;
  opacity:.9;
  transition:height 120ms linear,box-shadow 160ms ease,background 160ms ease;
}
.profile-page .user-top-information .profile-stat-pull::after { opacity:.075; }
.profile-page .profile-stat-pull.is-pulling::before { box-shadow:0 0 11px rgba(194,213,255,.48); }
.profile-page .profile-stat-pull.is-released::before { animation:lup-profile-cord-return 460ms cubic-bezier(.2,.92,.26,1); }
.profile-page .profile-stat-pull .profile-stat-pull-lever {
  position:relative;
  display:grid;
  place-items:center;
  width:43px;
  height:43px;
  margin:0 0 6px;
  border:1px solid rgba(255,255,255,.26);
  border-radius:15px;
  background:linear-gradient(145deg,#8b70ef,#5275cc);
  box-shadow:0 8px 0 rgba(49,40,106,.42),0 14px 22px rgba(0,0,0,.23),inset 0 1px 0 rgba(255,255,255,.3);
  color:#fff;
  transform:translate3d(0,var(--lup-up-pull,0px),0);
  transition:transform 180ms cubic-bezier(.2,.8,.25,1),box-shadow 180ms ease,filter 180ms ease;
}
.profile-page .profile-stat-pull .profile-stat-pull-lever::after {
  display:none;
}
.profile-page .profile-stat-pull .profile-stat-pull-lever .material-icons { margin:0; color:inherit; font-size:24px; text-shadow:0 1px 0 rgba(0,0,0,.18); }
.profile-page .profile-stat-pull.stat-locations .profile-stat-pull-lever { background:linear-gradient(145deg,#9c7bff,#635fc7); }
.profile-page .profile-stat-pull.stat-ups .profile-stat-pull-lever { background:linear-gradient(145deg,#f3c65d,#cf8351); color:#fff5c5; box-shadow:0 8px 0 rgba(133,76,38,.42),0 14px 22px rgba(0,0,0,.23),inset 0 1px 0 rgba(255,255,255,.34); }
/* UP is a shared moment, not an anonymous like. High Five remains the
   separate QR-confirmed gesture. */
.profile-page .profile-stat-pull.stat-ups .profile-up-pull-lever .material-icons { font-size:23px; transform:translateY(0); text-shadow:0 2px 7px rgba(101,53,22,.32); }
.profile-page .profile-stat-pull.stat-ups .profile-up-pull-lever::after { display:none; }

/* Visits / rank: an extension of the profile's personal route, not a separate
   trophy screen. Keep the data and ranking logic, soften the old game-card UI. */
.course-page { max-width:720px; padding-top:14px; background:radial-gradient(ellipse 72% 36% at 50% -8%,rgba(105,93,208,.15),transparent 72%),radial-gradient(circle at 96% 25%,rgba(72,172,224,.08),transparent 25%),transparent; }
.course-hero { gap:12px; min-height:76px; border-color:rgba(180,207,255,.13); border-radius:19px; background:linear-gradient(112deg,rgba(38,51,84,.72),rgba(18,25,43,.73) 68%,rgba(43,34,75,.58)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 11px 24px rgba(0,0,0,.12); }
.course-hero-mark { flex-basis:48px; width:48px; height:48px; border:1px solid rgba(179,213,255,.35); border-radius:15px 15px 15px 5px; background:linear-gradient(145deg,rgba(115,168,237,.50),rgba(102,84,190,.40)); box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 7px 16px rgba(10,17,48,.24); color:#eaf7ff; }
.course-hero-mark .material-icons { font-size:25px; }
.course-hero h2 { font-size:22px; letter-spacing:-.035em; }
.course-overview { border-radius:15px; background:rgba(8,14,27,.43); box-shadow:inset 0 1px 0 rgba(255,255,255,.06); }
.course-overview > div { min-height:64px; background:rgba(27,36,59,.62); }
.course-overview .course-goal { background:linear-gradient(105deg,rgba(77,129,208,.22),rgba(101,78,171,.17)); }
.course-ranking-note { margin-top:9px; padding:0 3px; color:#aebbd2; }
.course-timeline::before { background:linear-gradient(rgba(158,207,255,.48),rgba(124,103,218,.07)); }
.course-stop { border-color:rgba(177,207,247,.11); border-radius:16px; background:linear-gradient(108deg,rgba(59,81,133,.18),rgba(19,27,47,.49) 68%); box-shadow:inset 0 1px 0 rgba(255,255,255,.055); }
.course-stop:first-child { border-color:rgba(177,216,255,.22); background:linear-gradient(108deg,rgba(78,116,187,.25),rgba(27,31,56,.54) 68%); }
.course-stop-count { border-left-color:rgba(188,218,255,.08); }
.course-stop-count strong { color:#e8f4ff; }
.course-empty { border-style:solid; border-color:rgba(175,207,255,.14); background:linear-gradient(145deg,rgba(48,65,105,.20),rgba(15,22,40,.42)); }
@media (max-width:420px) { .course-page { padding-top:12px; }.course-hero { min-height:72px; }.course-hero-mark { flex-basis:44px; width:44px; height:44px; }.course-hero-mark .material-icons { font-size:23px; }.course-hero h2 { font-size:20px; }.course-stop { border-radius:15px; } }
.profile-page .profile-stat-pull.stat-friends .profile-stat-pull-lever { background:linear-gradient(145deg,#62c6f7,#4676cf); }
.profile-page .profile-stat-pull.stat-cuddles .profile-stat-pull-lever { background:linear-gradient(145deg,#ff9bb4,#cd5f93); }
.profile-page .profile-stat-pull.is-pulling .profile-stat-pull-lever { box-shadow:0 3px 0 rgba(38,39,83,.42),0 8px 15px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.30); filter:brightness(1.06); }
.profile-page .profile-stat-pull.stat-ups.is-pulling .profile-stat-pull-lever { box-shadow:0 3px 0 rgba(133,76,38,.42),0 8px 15px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.34); }
.profile-page .profile-stat-pull.is-released .profile-stat-pull-lever { animation:lup-profile-stat-lock 460ms cubic-bezier(.2,.92,.26,1); }
@keyframes lup-profile-stat-lock {
  0% { transform:translate3d(0,33px,0); }
  24% { transform:translate3d(0,39px,0); }
  49% { transform:translate3d(0,22px,0); }
  72% { transform:translate3d(0,4px,0); }
  100% { transform:translate3d(0,0,0); }
}
@keyframes lup-profile-cord-return {
  0% { height:57px; opacity:1; }
  24% { height:62px; opacity:1; }
  55% { height:35px; opacity:.92; }
  100% { height:15px; opacity:.9; }
}
@media (max-width:380px) {
  .profile-page .profile-stat-pull .profile-stat-pull-lever { width:38px; height:38px; border-radius:13px; }
  .profile-page .profile-stat-pull .profile-stat-pull-lever .material-icons { font-size:21px; }
}
@media (prefers-reduced-motion:reduce) {
  .profile-page .profile-stat-pull .profile-stat-pull-lever { transition:none; }
.profile-page .profile-stat-pull.is-released .profile-stat-pull-lever { animation:none; }
}

/* Each pull marker keeps its own quiet signal line. It extends the physical
   cord upward just enough to connect the icon to its meaning, without adding
   another visible card border. */
.profile-page .user-top-information .profile-stat-pull::before {
  width:1px;
  height:calc(18px + var(--lup-up-pull,0px));
  top:4px;
  z-index:1;
  opacity:.92;
  will-change:height;
}
.profile-page .user-top-information .profile-stat-pull.stat-locations::before { background:linear-gradient(to bottom,rgba(191,170,255,.10),rgba(174,143,255,.96) 54%,rgba(174,143,255,.20)); box-shadow:0 0 9px rgba(171,140,255,.52); }
.profile-page .user-top-information .profile-stat-pull.stat-ups::before { background:linear-gradient(to bottom,rgba(255,224,132,.10),rgba(255,205,100,.96) 54%,rgba(255,205,100,.20)); box-shadow:0 0 9px rgba(255,202,91,.48); }
.profile-page .user-top-information .profile-stat-pull.stat-friends::before { background:linear-gradient(to bottom,rgba(147,221,255,.10),rgba(112,198,247,.96) 54%,rgba(112,198,247,.20)); box-shadow:0 0 9px rgba(89,188,246,.48); }
.profile-page .user-top-information .profile-stat-pull.stat-cuddles::before { background:linear-gradient(to bottom,rgba(185,255,225,.10),rgba(111,220,181,.96) 54%,rgba(111,220,181,.20)); box-shadow:0 0 9px rgba(93,214,169,.52); }
.profile-page .user-top-information .profile-stat-pull.stat-message::before { background:linear-gradient(to bottom,rgba(255,188,214,.10),rgba(249,112,164,.96) 54%,rgba(249,112,164,.20)); box-shadow:0 0 9px rgba(246,102,157,.52); }

/* Dedicated signal rails: they are independent from the older pull-cord
   pseudo-elements, so each profile control keeps a clearly visible light line. */
.profile-page .user-top-information .profile-stat-pull { --profile-signal:#bca9ff; }
.profile-page .user-top-information .profile-stat-pull .profile-stat-signal {
  display:block; position:absolute; z-index:5;
  top:6px; left:15%; right:15%; width:auto; height:2px;
  min-height:2px; margin:0; padding:0; border:0;
  border-radius:999px; pointer-events:none; opacity:.98;
  background:linear-gradient(90deg,transparent 0%,var(--profile-signal) 20%,rgba(255,255,255,.94) 50%,var(--profile-signal) 80%,transparent 100%);
  box-shadow:0 0 5px var(--profile-signal),0 0 13px color-mix(in srgb,var(--profile-signal) 58%,transparent);
}
.profile-page .user-top-information .profile-stat-pull .profile-stat-pull-lever {
  position:relative;
  z-index:2;
}
.profile-page .user-top-information .profile-stat-pull .profile-stat-signal {
  z-index:20;
  top:3px;
  left:12%;
  right:12%;
  height:2px;
  background:linear-gradient(90deg,transparent 0%,var(--profile-signal) 17%,rgba(255,255,255,.82) 37%,#fff 50%,rgba(255,255,255,.82) 63%,var(--profile-signal) 83%,transparent 100%);
  box-shadow:0 0 6px var(--profile-signal),0 0 14px color-mix(in srgb,var(--profile-signal) 64%,transparent),0 0 2px rgba(255,255,255,.92);
}
.profile-page .user-top-information .profile-stat-pull.is-released::before {
  animation:none;
}

/* Five profile paths, five meanings: location violet, Up gold, friends blue,
   QR-confirmed High Fives mint, messages rose. */
.profile-page .user-top-information .profile-stat-pull.stat-cuddles { --profile-signal:#79e0bd; }
.profile-page .user-top-information .profile-stat-pull.stat-cuddles .profile-stat-pull-lever {
  border-color:rgba(202,255,231,.46);
  background:linear-gradient(145deg,#64cda6,#4d9c9b 68%,#557caf);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.42);
  color:#f6fcff;
}
.profile-page .user-top-information .profile-stat-pull.stat-cuddles .profile-stat-pull-lever .material-icons {
  color:#f7fdff;
  text-shadow:0 1px 1px rgba(20,75,70,.35),0 0 9px rgba(211,255,239,.28);
}
.profile-page .user-top-information .countitem.stat-cuddles {
  border-color:rgba(104,220,179,.26);
  background:linear-gradient(145deg,rgba(70,190,151,.16),rgba(78,126,184,.07));
}
.profile-page .user-top-information .profile-stat-pull.stat-message { --profile-signal:#ff9fbe; }
.profile-page .user-top-information .stat-message .profile-stat-pull-lever {
  border-color:rgba(255,216,230,.44);
  background:linear-gradient(145deg,#f477aa,#b94980);
  box-shadow:0 8px 0 rgba(129,39,77,.43),0 14px 22px rgba(0,0,0,.23),inset 0 1px 0 rgba(255,255,255,.35);
  color:#fbf9ff;
}
.profile-page .user-top-information .stat-message {
  border-color:rgba(255,132,174,.32);
  background:linear-gradient(150deg,rgba(243,79,137,.21),rgba(172,56,103,.09));
}
.profile-page .user-top-information .countitem .count {
  display:block;
  min-height:22px;
  font-size:clamp(17px,4.7vw,20px);
  line-height:1.1;
  font-variant-numeric:tabular-nums;
}
.profile-page .user-top-information .countitem .item {
  display:block;
  min-height:20px;
  padding:0 2px;
  overflow-wrap:anywhere;
  color:#c7c7d5;
  font-size:clamp(7px,1.95vw,9px);
  font-weight:760;
  line-height:1.12;
  letter-spacing:.035em;
  text-align:center;
  white-space:normal;
}
.profile-page .user-top-information .profile-stat-pull .profile-stat-pull-lever .material-icons {
  color:#fbfdff;
  text-shadow:0 1px 1px rgba(18,29,67,.42),0 0 7px rgba(255,255,255,.18);
}

/* Header actions share one physical size. Material's default icon-button
   clipping used to cut the notification seal at the lower-right corner. */
.lup-top-bar .md-toolbar-tools > .md-icon-button.lup-top-notification {
  position:relative;
  display:grid;
  place-items:center;
  flex:0 0 36px;
  width:36px;
  min-width:36px;
  height:36px;
  min-height:36px;
  margin:0;
  padding:0;
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.lup-top-bar .md-toolbar-tools .navnotification {
  display:grid;
  place-items:center;
  box-sizing:border-box;
  width:32px;
  height:32px;
  margin:0;
  border:0;
  border-radius:50%;
  background-color:transparent;
  background-image:none;
  background-size:0;
  color:#d9eaff;
  font-size:20px;
  line-height:1;
  text-shadow:0 0 7px rgba(151,211,255,.32);
}
.lup-top-bar .md-toolbar-tools .navnotification-count {
  position:absolute;
  z-index:3;
  top:3px;
  right:3px;
  bottom:auto;
  left:auto;
  box-sizing:border-box;
  margin:0;
}
.lup-top-bar .md-toolbar-tools > div.lup-avatar {
  box-sizing:border-box;
  flex:0 0 36px;
  width:36px;
  height:36px;
  margin:0 0 0 8px;
  padding:2px;
}
.lup-top-bar,
.lup-top-bar .md-toolbar-tools,
.lup-top-bar .md-toolbar-tools > .md-icon-button.lup-top-notification {
  overflow:visible;
}
.lup-top-bar .md-toolbar-tools .navnotification {
  overflow:visible;
  font-size:20px;
}

/* The shared list-avatar stylesheet keeps an old two-pixel inset. Inside the
   Online roster that makes the face appear left/down inside its round rim.
   This row owns a true circle: rim and image share exactly the same centre. */
.location-page md-list.usernavigation.location-online-view .presence-person .presence-avatar {
  box-sizing:border-box;
  padding:0;
  overflow:hidden;
  border-radius:50%;
}
.location-page md-list.usernavigation.location-online-view .presence-person .presence-avatar .img,
.location-page md-list.usernavigation.location-online-view .presence-person .presence-avatar span {
  position:absolute;
  top:0;
  right:auto;
  bottom:auto;
  left:0;
  width:100%;
  height:100%;
  margin:0;
  border-radius:50%;
}
.location-page md-list.usernavigation.location-online-view .presence-person .presence-avatar {
  overflow:visible;
}
.location-page md-list.usernavigation.location-online-view .presence-person .presence-avatar::after {
  z-index:3;
  right:-4px;
  bottom:-3px;
  width:10px;
  height:10px;
  border:2px solid #182235;
  background:#72dda0;
  box-shadow:0 0 0 3px rgba(114,221,160,.12),0 0 11px rgba(114,221,160,.64);
}
.profile-page .user-top-information .profile-stat-pull.stat-ups { --profile-signal:#ffd365; }
.profile-page .user-top-information .profile-stat-pull.stat-friends { --profile-signal:#75d5ff; }
.profile-page .user-top-information .profile-stat-pull.stat-cuddles { --profile-signal:#79e0bd; }
.profile-page .user-top-information .profile-stat-pull.stat-message { --profile-signal:#ff9fbe; }

/* Final signal palette — kept beside the legacy rules so no older accent can
   repaint a marker differently from its icon. */
.profile-page .user-top-information .profile-stat-pull.stat-locations { --profile-signal:#bca9ff; }
.profile-page .user-top-information .profile-stat-pull.stat-ups { --profile-signal:#ffd365; }
.profile-page .user-top-information .profile-stat-pull.stat-friends { --profile-signal:#75d5ff; }
.profile-page .user-top-information .profile-stat-pull.stat-cuddles { --profile-signal:#79e0bd; }
.profile-page .user-top-information .profile-stat-pull.stat-message { --profile-signal:#ff9fbe; }

/* Let the profile sections meet cleanly. The active section alone carries
   light; there is deliberately no inactive rail beneath it. */
.profile-page .profile-section-nav { position:relative; width:100%; margin:0 0 6px; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
.profile-page .profile-section-nav button { position:relative; height:48px; border-radius:0; color:#9c97ad; transition:background .24s ease,color .2s ease,filter .2s ease; }
.profile-page .profile-section-nav button + button { border-left:0; }
.profile-page .profile-section-nav button + button::before { content:''; position:absolute; z-index:2; top:12px; bottom:12px; left:0; width:1px; background:linear-gradient(180deg,transparent,rgba(205,197,238,.33),transparent); }
.profile-page .profile-section-nav button::after { content:''; position:absolute; z-index:3; right:0; bottom:0; left:0; height:2px; background:transparent; box-shadow:none; opacity:0; transform:scaleX(.26); transition:transform .28s cubic-bezier(.2,.8,.2,1),opacity .2s ease,background .18s ease,box-shadow .18s ease; }
.profile-page .profile-section-nav button:hover { background:rgba(255,255,255,.035); }
.profile-page .profile-section-nav button:active { filter:brightness(1.12); }
.profile-page .profile-section-nav button.active { background:radial-gradient(ellipse at 50% 100%,rgba(147,119,245,.24),transparent 70%); box-shadow:0 5px 14px rgba(102,80,193,.13); color:#fbfaff; }
.profile-page .profile-section-nav button.active::after { background:linear-gradient(90deg,transparent 2%,#aa9cff 20%,#d1c8ff 50%,#aa9cff 80%,transparent 98%); box-shadow:0 0 10px rgba(183,164,255,.72); opacity:1; transform:scaleX(1); }
.profile-page .profile-section-nav button .material-icons { transition:transform .25s cubic-bezier(.2,.85,.24,1),color .2s ease,text-shadow .2s ease; }
.profile-page .profile-section-nav button.active .material-icons { transform:translateY(-1px) scale(1.1); }
.profile-page .profile-section-nav button.active .material-icons { color:#e8e1ff; text-shadow:0 0 13px rgba(189,172,255,.56); }
.profile-page .information-tabs md-tabs-content-wrapper,
.profile-page .information-tabs .md-tab-content,
.profile-page .information-tabs .md-tab-content > div { margin-top:0; padding-top:0; }
.profile-page .profile-information.profile-about-single { padding-top:0; }
.profile-page .gallery-grid { padding-top:0; }

/* Angular Material's dynamic-height mode animates the entire profile height
   for 500 ms. Switching from a long About section to a short gallery then
   forces the scroll container upward mid-animation. Keep the active panel in
   normal document flow and animate only its content surface. */
.profile-page .information-tabs:not(.md-dynamic-height) md-tabs-content-wrapper {
  position:relative;
  top:auto;
  right:auto;
  bottom:auto;
  left:auto;
  min-height:0;
  overflow:visible;
}
.profile-page .information-tabs:not(.md-dynamic-height) md-tab-content.md-active {
  position:relative;
  bottom:auto;
  overflow:hidden;
}
.profile-page .information-tabs:not(.md-dynamic-height) md-tab-content.md-active > div {
  animation:lup-profile-panel-arrive .22s cubic-bezier(.2,.8,.25,1) both;
}
@keyframes lup-profile-panel-arrive {
  from { opacity:.58; transform:translate3d(0,6px,0); }
  to { opacity:1; transform:translate3d(0,0,0); }
}
@media (prefers-reduced-motion:reduce) {
  .profile-page .information-tabs:not(.md-dynamic-height) md-tab-content.md-active > div { animation:none; }
}

/* Gallery entry: an elegant empty album slot instead of a technical upload
   field. It stays clearly actionable without competing with real photos. */
.profile-page .gallery-add-tile { position:relative; gap:9px; border:1px solid rgba(195,187,231,.16); border-radius:17px; background:radial-gradient(circle at 50% 28%,rgba(149,125,237,.17),transparent 31%),linear-gradient(145deg,rgba(49,50,73,.70),rgba(24,26,40,.82)); box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 10px 20px rgba(0,0,0,.13); color:#d6d0e6; }
.profile-page .gallery-add-tile::before { display:block; content:''; position:absolute; width:66%; height:1px; bottom:18px; background:linear-gradient(90deg,transparent,rgba(197,187,238,.23),transparent); }
.profile-page .gallery-add-tile .material-icons { display:grid; place-items:center; width:38px; height:38px; border:1px solid rgba(219,211,250,.20); border-radius:13px; background:rgba(176,159,242,.12); box-shadow:inset 0 1px 0 rgba(255,255,255,.12); color:#cfc4ff; font-size:20px; }
.profile-page .gallery-add-tile span { display:block; position:relative; color:#bcb5cf; font:720 10px/1 Ubuntu,Roboto,Arial,sans-serif; letter-spacing:.045em; text-transform:uppercase; }
.profile-page .gallery-add-tile:hover { border-color:rgba(190,174,255,.40); background:radial-gradient(circle at 50% 28%,rgba(157,132,244,.25),transparent 34%),linear-gradient(145deg,rgba(56,55,85,.84),rgba(25,28,44,.92)); transform:translateY(-2px); }
.profile-page .gallery-add-tile:hover .material-icons { color:#eeeaff; box-shadow:0 0 14px rgba(174,153,255,.22),inset 0 1px 0 rgba(255,255,255,.15); }

/* Profile sections: use Angular's real captions instead of the old overlay
   fallback. Gallery and About can therefore never be shown with swapped text. */
@media (max-width:768px) {
  .profile-page .information-tabs md-tabs-canvas { display:block; width:100%; height:52px; }
  .profile-page .information-tabs md-pagination-wrapper { display:flex; width:100%; height:52px; transform:none; }
  .profile-page .information-tabs md-tab-item { display:flex; flex:1 1 50%; width:50%; max-width:50%; min-width:0; height:46px; min-height:46px; margin:3px 0; border:0; border-radius:0; background:transparent; box-shadow:none; }
  .profile-page .information-tabs md-tab-item .md-tab-label { display:flex; align-items:center; justify-content:center; width:100%; height:46px; font-family:Ubuntu,Roboto,Arial,sans-serif; font-size:11px; font-weight:760; line-height:1; color:#a9a4b8; letter-spacing:.02em; text-transform:none; visibility:visible; opacity:1; }
  .profile-page .information-tabs md-tab-item::after { content:none; display:none; }
  .profile-page .information-tabs md-tab-item .md-tab-label::before { display:none; content:none; }
  .profile-page .information-tabs md-tab-item.md-active { background:linear-gradient(135deg,rgba(128,104,226,.22),rgba(77,137,204,.10)); box-shadow:inset 0 -2px 0 #a99aff,inset 0 1px 0 rgba(255,255,255,.11); }
  .profile-page .information-tabs md-tab-item.md-active .md-tab-label { color:#f6f3ff; text-shadow:0 0 9px rgba(202,191,255,.22); }
}
.location-page md-tabs md-tab-item.md-active .md-tab-label::before { transform:none; background:rgba(185,171,255,.18); color:#f5f2ff; }
.location-page md-tabs md-ink-bar { display:none; }

/* One shared night-blue canvas. Navigation must feel like an extension of the
   location and profile views, not like a separate blue application. */
.profile-page,
.profile-page md-content,
.md-sidenav-left,
.md-sidenav-left md-content {
  background:
    radial-gradient(ellipse 80% 38% at 8% -10%,rgba(85,116,205,.16),transparent 70%),
    radial-gradient(ellipse 62% 34% at 94% 24%,rgba(143,91,214,.13),transparent 72%),
    radial-gradient(circle at 22% 74%,rgba(63,144,191,.08),transparent 35%),
    linear-gradient(155deg,#171a29 0%,#1b1d2d 48%,#151724 100%);
}

/* “Alle” is a real category choice as well. Its active frame must use the
   same complete, calm glow as city, café and club instead of lighting only
   the tiny grid glyph. */
.nearby .location-categories button:first-child.active {
  border-color:color-mix(in srgb,var(--lup-category-ink) 52%,transparent);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--lup-category-ink) 12%,transparent),0 0 15px color-mix(in srgb,var(--lup-category-ink) 25%,transparent),inset 0 1px 0 rgba(255,255,255,.18);
  outline:1px solid color-mix(in srgb,var(--lup-category-ink) 26%,transparent);
  outline-offset:3px;
}
.nearby .location-categories button:first-child.active .material-icons {
  transform:translateY(-2px);
  border-color:color-mix(in srgb,var(--lup-category-ink) 68%,#fff);
  background:linear-gradient(145deg,color-mix(in srgb,var(--lup-category-ink) 34%,#52566a),color-mix(in srgb,var(--lup-category-ink) 16%,#232637));
  color:#fff;
}

/* Final sidebar surface: this intentionally comes last because older Material
 * toolbar rules otherwise repaint the LinkUUp header as a metallic black bar. */
.md-sidenav-left,
.md-sidenav-left md-content {
  background:radial-gradient(ellipse 92% 30% at 12% 0,rgba(66,157,229,.16),transparent 70%),radial-gradient(ellipse 68% 34% at 94% 37%,rgba(126,86,211,.14),transparent 72%),linear-gradient(162deg,#111c30 0%,#151a2d 51%,#0f1422 100%);
}
.md-sidenav-left md-toolbar.sidenav-brand,
.md-sidenav-left .sidenav-brand {
  min-height:82px;
  background:radial-gradient(circle at 88% 24%,rgba(99,189,247,.32),transparent 29%),linear-gradient(115deg,#32295d 0%,#1a3158 56%,#121d33 100%);
  border-bottom:1px solid rgba(184,219,255,.17);
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.055),0 8px 19px rgba(4,9,22,.22);
}
.md-sidenav-left .sidenav-brand .md-toolbar-tools { height:82px; }
.md-sidenav-left .sidenav-brand h1 { color:#f7fbff; font-weight:760; letter-spacing:-.035em; }
.md-sidenav-left .sidenav-brand span { color:#b7d6f0; }
.md-sidenav-left md-list-item .nav-icon,
.md-sidenav-left md-list-item.nav-discover .nav-icon,
.md-sidenav-left md-list-item.nav-profile .nav-icon,
.md-sidenav-left md-list-item.nav-friends .nav-icon,
.md-sidenav-left md-list-item.nav-settings .nav-icon,
.md-sidenav-left md-list-item.nav-account .nav-icon,
.md-sidenav-left md-list-item.nav-profile-settings .nav-icon,
.md-sidenav-left md-list-item.nav-logout .nav-icon {
  width:24px;
  height:24px;
  margin-right:14px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  font-size:19px;
}
.md-sidenav-left md-list-item:hover .nav-icon { transform:translateX(1px); background:transparent; box-shadow:none; }
.md-sidenav-left md-list-item::before { background:transparent; }
.md-sidenav-left md-list-item:hover { border-color:transparent; background:linear-gradient(90deg,rgba(84,157,223,.18),rgba(123,92,202,.07) 68%,transparent); }
.md-sidenav-left md-list-item:hover::before { background:#9fddff; box-shadow:0 0 11px rgba(129,208,255,.62); }

/* The overview seal is now part of the same labelled category family. */
.nearby .location-categories button:first-child span {
  visibility:visible;
  color:color-mix(in srgb,var(--lup-category-ink) 74%,#f4f2fa);
}
.nearby .location-categories button:first-child.active span { color:#fff; }

/* Location reviews are a destination of their own: a compact reputation
   board, clear invitation and readable real voices—not an old generic list. */
.location-reviews-page > md-content {
  background:radial-gradient(circle at 86% -7%,rgba(127,104,237,.22),transparent 33%),radial-gradient(circle at 7% 36%,rgba(76,165,225,.10),transparent 31%),linear-gradient(155deg,#171a29 0%,#1b1d2d 48%,#151724 100%);
}
.review-top-identity .location-top-icon { background:linear-gradient(145deg,rgba(163,137,242,.42),rgba(70,147,218,.25)); }
.reviews-hero { position:relative; display:grid; grid-template-columns:58px minmax(0,1fr); gap:13px; margin:16px 14px 11px; padding:17px; overflow:hidden; border:1px solid rgba(210,201,246,.16); border-radius:20px; background:linear-gradient(145deg,rgba(64,59,105,.58),rgba(27,31,50,.86)); box-shadow:inset 0 1px 0 rgba(255,255,255,.11),0 14px 27px rgba(0,0,0,.17); }
.reviews-hero::after { content:''; position:absolute; right:-34px; bottom:-58px; width:155px; height:155px; border:1px solid rgba(208,195,255,.16); border-radius:50%; box-shadow:0 0 0 18px rgba(151,124,241,.035),0 0 28px rgba(103,154,237,.16); pointer-events:none; }
.reviews-hero-mark { display:grid; place-items:center; width:54px; height:54px; border:1px solid rgba(236,226,255,.28); border-radius:18px 18px 18px 7px; background:linear-gradient(145deg,#aa8bfa,#577fd2); box-shadow:0 8px 0 rgba(62,53,133,.28),0 13px 20px rgba(0,0,0,.19),inset 0 1px 0 rgba(255,255,255,.35); color:#fff; }
.reviews-hero-mark .material-icons { font-size:29px; }
.reviews-hero-copy { min-width:0; }.reviews-hero-copy > span { color:#bdb0ed; font-size:9px; font-weight:850; letter-spacing:.13em; }.reviews-hero-copy h1 { margin:3px 0 5px; overflow:hidden; color:#f8f6ff; font-size:18px; font-weight:790; line-height:1.13; text-overflow:ellipsis; white-space:nowrap; }.reviews-hero-copy p { margin:0; color:#c9c4d8; font-size:11px; line-height:1.4; }
.reviews-rate-cta { position:relative; z-index:1; grid-column:1 / -1; display:flex; align-items:center; gap:7px; width:100%; min-height:43px; margin-top:3px; padding:0 12px; border:1px solid rgba(205,190,255,.28); border-radius:13px; background:linear-gradient(105deg,rgba(155,124,241,.34),rgba(71,136,207,.18)); box-shadow:inset 0 1px 0 rgba(255,255,255,.17); color:#f8f6ff; font:780 12px/1 Ubuntu,Roboto,Arial,sans-serif; cursor:pointer; }.reviews-rate-cta .material-icons:first-child { color:#ffe09a; font-size:20px; }.reviews-rate-cta .material-icons:last-child { margin-left:auto; color:#d9d1ff; font-size:18px; }
.reviews-scoreboard { display:flex; align-items:center; gap:13px; margin:0 14px 16px; padding:12px 15px; border:1px solid rgba(255,255,255,.10); border-radius:17px; background:rgba(255,255,255,.045); box-shadow:inset 0 1px 0 rgba(255,255,255,.07); cursor:pointer; }.reviews-score { display:flex; align-items:baseline; gap:4px; min-width:70px; padding-right:13px; border-right:1px solid rgba(255,255,255,.10); }.reviews-score strong { color:#fff5c8; font-size:27px; line-height:1; }.reviews-score span,.reviews-stars small { color:#aaa4bd; font-size:10px; font-weight:700; }.reviews-stars { display:grid; gap:4px; }.reviews-stars .jk-rating-stars-container .material-icons { color:#ffd36e; font-size:17px; }.reviews-scoreboard > .material-icons { margin-left:auto; color:#bcaeff; }
.location-reviews-page md-list { padding:0 14px 28px; }.location-reviews-page md-subheader { margin:0 0 6px; padding:9px 1px; }.reviews-list-heading { display:flex; align-items:center; gap:7px; color:#c6bed8; font-size:10px; font-weight:850; letter-spacing:.11em; text-transform:uppercase; }.reviews-list-heading .material-icons { color:#b6a5f3; font-size:17px; }.reviews-list-heading b { display:grid; place-items:center; min-width:20px; height:20px; margin-left:auto; border-radius:999px; background:rgba(157,132,238,.18); color:#e9e2ff; font-size:10px; }
.location-reviews-page md-list-item { min-height:70px; margin:8px 0; padding:9px 11px; border-color:rgba(208,199,239,.12); border-radius:17px; background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.022)); box-shadow:inset 0 1px 0 rgba(255,255,255,.065); }.location-reviews-page md-list-item .lup-avatar { width:36px; height:36px; margin-right:4px; }.location-reviews-page md-list-item .lup-comment-text { color:#f0edf7; font-size:13px; line-height:1.48; }.location-reviews-page md-list-item .lup-comment-date { margin-top:4px; color:#aaa4bb; font-size:10px; }.location-reviews-page md-list-item .md-secondary .material-icons { color:#f1a1b3; }
.lup-comment-dialog { overflow:hidden; border:1px solid rgba(210,199,255,.20); border-radius:22px; background:linear-gradient(155deg,#292744,#171927); }.lup-comment-dialog md-toolbar,.lup-comment-dialog md-toolbar .md-toolbar-tools { background:transparent; border:0; }.lup-comment-dialog md-dialog-content,.lup-comment-dialog .md-dialog-content { background:transparent; }.vote-dialog-intro { display:flex; align-items:center; gap:10px; margin:0 0 15px; color:#d4cde8; font-size:12px; line-height:1.4; }.vote-dialog-intro .material-icons { display:grid; place-items:center; width:34px; height:34px; border-radius:11px; background:rgba(163,136,244,.18); color:#d9ccff; }.vote-dialog-intro p { margin:0; }.lup-comment-dialog jk-rating-stars { display:flex; justify-content:center; margin:4px 0 18px; }.lup-comment-dialog jk-rating-stars .material-icons { color:#ffd36e; font-size:28px; }.lup-comment-dialog textarea { min-height:104px; padding:11px; box-sizing:border-box; border:1px solid rgba(213,204,243,.17); border-radius:13px; background:rgba(255,255,255,.055); color:#f7f4ff; resize:vertical; }.lup-comment-dialog md-dialog-actions { padding:10px 18px 16px; }.lup-comment-dialog .vote-save { border:1px solid rgba(214,202,255,.24); border-radius:11px; background:linear-gradient(135deg,#997eea,#668bd6); color:#fff; }
@media (max-width:420px) { .reviews-hero { margin-right:10px; margin-left:10px; padding:15px; }.reviews-scoreboard { margin-right:10px; margin-left:10px; }.location-reviews-page md-list { padding-right:10px; padding-left:10px; } }

/* Writing surfaces belong to the review atmosphere as much as the cards do. */
.lup-comment-dialog md-input-container { margin:0; padding:0; background:transparent; }
.lup-comment-dialog textarea,
.location-chat-surface .chatbottom input {
  border-color:rgba(176,162,239,.28);
  background:linear-gradient(145deg,rgba(91,83,145,.28),rgba(32,37,60,.92));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 7px 16px rgba(0,0,0,.12);
  color:#f7f4ff;
  -webkit-text-fill-color:#f7f4ff;
}
.lup-comment-dialog textarea::placeholder,
.location-chat-surface .chatbottom input::placeholder { color:#b7b0cb; opacity:1; }
.lup-comment-dialog textarea:focus,
.location-chat-surface .chatbottom input:focus { border-color:#b9a8ff; box-shadow:0 0 0 3px rgba(162,139,247,.15),inset 0 1px 0 rgba(255,255,255,.09); }

/* The vote window must always sit above the location tabs and the sidenav.
   This is intentionally explicit: earlier experiments left the Material
   overlay below a few mobile layers, making a star tap appear to do nothing. */
.md-dialog-container { z-index:10020; }
md-backdrop.md-dialog-backdrop { z-index:10010; }
.lup-proximity-dialog { position:relative; width:min(392px,calc(100vw - 30px)); overflow:hidden; border:1px solid rgba(174,218,255,.21); border-radius:24px; background:radial-gradient(circle at 85% 3%,rgba(90,167,243,.22),transparent 33%),linear-gradient(155deg,#17263e,#0c1424); box-shadow:0 28px 76px rgba(0,0,0,.52),0 0 42px rgba(89,165,241,.12); color:#edf7ff; }.lup-proximity-dialog::before { content:''; position:absolute; inset:-38% -20% auto; height:175px; border:1px solid rgba(155,214,255,.13); border-radius:50%; box-shadow:0 0 0 26px rgba(142,199,255,.035),0 0 0 53px rgba(142,199,255,.02); pointer-events:none; }.lup-proximity-dialog md-dialog-content,.lup-proximity-dialog .md-dialog-content { background:transparent; }.lup-proximity-dialog-content { position:relative; padding:28px 25px 13px; text-align:center; }.lup-proximity-close { position:absolute; z-index:2; top:11px; right:11px; display:grid; place-items:center; width:32px; height:32px; padding:0; border:1px solid rgba(213,236,255,.14); border-radius:11px; background:rgba(5,13,26,.34); color:#c9d9ea; cursor:pointer; }.lup-proximity-close .material-icons { font-size:18px; }.lup-proximity-signal { position:relative; display:grid; place-items:center; width:64px; height:64px; margin:0 auto 12px; border:1px solid rgba(194,230,255,.42); border-radius:50% 50% 50% 16px; background:linear-gradient(145deg,#5caeee,#526ec1); box-shadow:0 8px 0 rgba(39,70,133,.42),0 17px 30px rgba(0,0,0,.24),0 0 31px rgba(115,196,255,.31),inset 0 1px rgba(255,255,255,.40); color:#fff; }.lup-proximity-signal::before,.lup-proximity-signal::after { content:''; position:absolute; border:1px solid rgba(151,220,255,.31); border-radius:50%; pointer-events:none; }.lup-proximity-signal::before { inset:-12px; }.lup-proximity-signal::after { inset:-25px; opacity:.45; }.lup-proximity-signal .material-icons { font-size:37px; text-shadow:0 2px 7px rgba(8,24,55,.38); }.lup-proximity-eyebrow { display:block; color:#9bd8ff; font-size:9px; font-weight:850; letter-spacing:.16em; }.lup-proximity-dialog h2 { margin:6px 0 8px; color:#f3f9ff; font-size:22px; line-height:1.12; letter-spacing:-.03em; }.lup-proximity-dialog p { max-width:294px; margin:0 auto; color:#bdcee1; font-size:12px; line-height:1.5; }.lup-proximity-rule { display:flex; align-items:flex-start; gap:8px; margin:17px 0 0; padding:10px 11px; border-left:2px solid #8bd6ff; background:rgba(116,191,255,.08); color:#d9eafb; font-size:10px; line-height:1.4; text-align:left; }.lup-proximity-rule .material-icons { flex:0 0 auto; color:#a8e6ca; font-size:16px; }.lup-proximity-dialog md-dialog-actions { min-height:0; padding:11px 18px 17px; justify-content:center; }.lup-proximity-ok { width:100%; min-height:43px; border:1px solid rgba(203,235,255,.29); border-radius:13px; background:linear-gradient(135deg,#65b9ef,#6477cf); box-shadow:0 5px 0 rgba(44,67,133,.44),0 11px 18px rgba(0,0,0,.20),inset 0 1px rgba(255,255,255,.36); color:#fff; font:800 12px inherit; cursor:pointer; }
.md-dialog-container .lup-comment-dialog {
  display:block;
  width:calc(100vw - 32px);
  max-width:430px;
  max-height:calc(var(--lup-viewport-height,100dvh) - 32px);
  margin:0 auto;
}
.lup-comment-dialog .md-toolbar-tools h2 { color:#f7f4ff; font-size:18px; font-weight:700; }
.lup-comment-dialog md-dialog-actions .md-button { min-height:38px; border-radius:10px; color:#d9d3e8; }

/* Removing a friend is a considered relationship action, not an alarm. */
.lup-friend-delete-dialog { box-sizing:border-box; width:calc(100vw - 24px); max-width:390px; max-height:calc(var(--lup-viewport-height,100dvh) - 24px); margin:12px; overflow:hidden; border:1px solid rgba(180,205,244,.18); border-radius:20px; background:linear-gradient(155deg,#202a40,#121926); box-shadow:0 24px 52px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.10); }
.lup-friend-delete-dialog md-toolbar,.lup-friend-delete-dialog md-toolbar .md-toolbar-tools { min-height:57px; padding:0 13px; background:transparent; border:0; }
.lup-friend-delete-dialog .friend-delete-mark { display:grid; place-items:center; width:30px; height:30px; margin-right:9px; border:1px solid rgba(172,208,248,.23); border-radius:10px; background:linear-gradient(145deg,rgba(104,155,215,.25),rgba(101,94,166,.18)); color:#d8ecff; box-shadow:inset 0 1px 0 rgba(255,255,255,.16); }
.lup-friend-delete-dialog .friend-delete-mark .material-icons { font-size:18px; }
.lup-friend-delete-dialog .md-toolbar-tools h2 { overflow:hidden; margin:0; color:#fbf9ff; font-size:16px; font-weight:760; text-overflow:ellipsis; white-space:nowrap; }
.lup-friend-delete-dialog .md-icon-button { width:33px; height:33px; min-height:33px; margin:0; border:1px solid rgba(255,255,255,.09); border-radius:10px; background:rgba(255,255,255,.04); color:#dce9fa; }
.lup-friend-delete-dialog md-dialog-content,.lup-friend-delete-dialog .md-dialog-content { background:transparent; }
.lup-friend-delete-dialog .friend-delete-content { padding:3px 16px 11px; }
.lup-friend-delete-dialog .friend-delete-person { display:flex; align-items:center; gap:11px; padding:11px; border:1px solid rgba(178,207,246,.12); border-radius:15px; background:linear-gradient(110deg,rgba(95,139,204,.10),rgba(255,255,255,.03)); box-shadow:inset 0 1px 0 rgba(255,255,255,.07); }
.lup-friend-delete-dialog .friend-delete-person .lup-avatar { flex:0 0 auto; width:42px; height:42px; margin:0; }
.lup-friend-delete-dialog .friend-delete-person div { display:grid; min-width:0; gap:3px; }
.lup-friend-delete-dialog .friend-delete-person strong { overflow:hidden; color:#fff; font-size:14px; text-overflow:ellipsis; white-space:nowrap; }
.lup-friend-delete-dialog .friend-delete-person span { color:#b9c9dc; font-size:11px; line-height:1.35; }
.lup-friend-delete-dialog .friend-delete-content > p { margin:12px 2px 3px; color:#d6dfed; font-size:12px; line-height:1.46; }
.lup-friend-delete-dialog md-dialog-actions { min-height:61px; padding:10px 16px 14px; border-top:1px solid rgba(184,211,247,.09); }
.lup-friend-delete-dialog .friend-delete-actions .md-button { flex:1 1 0; min-width:0; min-height:39px; margin:0; padding:0 10px; border-radius:11px; font-size:12px; font-weight:750; letter-spacing:.01em; }
.lup-friend-delete-dialog .friend-delete-cancel { border:1px solid rgba(181,205,239,.17); background:rgba(255,255,255,.03); color:#dbe6f4; }
.lup-friend-delete-dialog .friend-delete-confirm { display:inline-flex; align-items:center; justify-content:center; gap:6px; margin-left:8px; border:1px solid rgba(244,174,195,.24); background:linear-gradient(135deg,rgba(175,79,112,.23),rgba(111,79,147,.18)); color:#ffe1ea; }
.lup-friend-delete-dialog .friend-delete-confirm .material-icons { font-size:17px; }
.lup-friend-delete-dialog .friend-delete-cancel:hover { background:rgba(255,255,255,.09); }
.lup-friend-delete-dialog .friend-delete-confirm:hover { border-color:rgba(255,190,211,.48); background:rgba(203,96,133,.24); }
@media (max-width:360px) { .lup-friend-delete-dialog .friend-delete-content { padding-right:13px; padding-left:13px; }.lup-friend-delete-dialog .friend-delete-actions .md-button { padding-right:7px; padding-left:7px; font-size:11px; }.lup-friend-delete-dialog .friend-delete-confirm { margin-left:6px; } }
@media (prefers-reduced-motion:reduce) { .lup-friend-delete-dialog * { transition:none; } }
.lup-friend-delete-dialog { border-color:rgba(167,211,255,.20); background:radial-gradient(circle at 82% 0%,rgba(86,159,232,.18),transparent 34%),linear-gradient(155deg,#192742,#0d1627); }.lup-friend-delete-dialog .friend-delete-content--calm { position:relative; padding:27px 23px 14px; text-align:center; }.lup-friend-delete-dialog .friend-delete-close { position:absolute; top:11px; right:11px; display:grid; place-items:center; width:31px; height:31px; padding:0; border:1px solid rgba(212,233,255,.13); border-radius:10px; background:rgba(8,17,31,.30); color:#c8d8ea; cursor:pointer; }.lup-friend-delete-dialog .friend-delete-close .material-icons { font-size:18px; }.lup-friend-delete-dialog .friend-delete-connection { position:relative; display:grid; place-items:center; width:72px; height:61px; margin:0 auto 10px; }.lup-friend-delete-dialog .friend-delete-connection > span { position:absolute; width:66px; height:1px; background:linear-gradient(90deg,transparent,rgba(168,215,255,.72),transparent); transform:rotate(-18deg); }.lup-friend-delete-dialog .friend-delete-connection .lup-avatar { position:relative; z-index:1; width:53px; height:53px; margin:0; border:2px solid rgba(205,235,255,.55); border-radius:50%; box-shadow:0 0 0 6px rgba(119,185,255,.08),0 10px 23px rgba(0,0,0,.23); }.lup-friend-delete-dialog .friend-delete-connection > .material-icons { position:absolute; z-index:2; right:0; bottom:0; display:grid; place-items:center; width:24px; height:24px; border:1px solid rgba(231,190,207,.33); border-radius:50%; background:#3b3049; color:#ffd6e3; font-size:13px; }.lup-friend-delete-dialog .friend-delete-eyebrow { display:block; color:#a6dafd; font-size:9px; font-weight:850; letter-spacing:.16em; }.lup-friend-delete-dialog .friend-delete-content--calm h2 { margin:6px 0 7px; color:#f4f8ff; font-size:21px; font-weight:780; letter-spacing:-.03em; }.lup-friend-delete-dialog .friend-delete-question { max-width:265px; margin:0 auto; color:#c2d1e4; font-size:12px; line-height:1.48; }.lup-friend-delete-dialog .friend-delete-note { display:flex; align-items:flex-start; gap:7px; margin:16px 0 0; padding:9px 10px; border-left:2px solid #83cefa; background:rgba(109,187,245,.07); color:#d8e7f8; font-size:10px; line-height:1.38; text-align:left; }.lup-friend-delete-dialog .friend-delete-note .material-icons { flex:0 0 auto; color:#9cdcff; font-size:16px; }.lup-friend-delete-dialog .friend-delete-actions--calm { display:grid; grid-template-columns:1fr; gap:8px; padding:10px 18px 17px; border-top:1px solid rgba(187,216,247,.09); }.lup-friend-delete-dialog .friend-delete-actions--calm .md-button { width:100%; min-height:41px; margin:0; border-radius:12px; font-size:12px; font-weight:780; letter-spacing:0; text-transform:none; }.lup-friend-delete-dialog .friend-delete-actions--calm .friend-delete-cancel { order:0; border:1px solid rgba(190,220,248,.18); background:linear-gradient(135deg,rgba(90,155,221,.28),rgba(92,108,192,.26)); color:#f2f8ff; box-shadow:inset 0 1px rgba(255,255,255,.20); }.lup-friend-delete-dialog .friend-delete-actions--calm .friend-delete-confirm { order:1; margin:0; border:0; background:transparent; box-shadow:none; color:#aebfd4; }.lup-friend-delete-dialog .friend-delete-actions--calm .friend-delete-confirm:hover { background:rgba(255,255,255,.045); color:#f3d5df; }.lup-friend-delete-dialog .friend-delete-actions--calm .friend-delete-confirm .material-icons { font-size:15px; }

/* Friends is a contact space: search, recognise, then choose one calm action. */
.friends-page > md-content { background:radial-gradient(circle at 84% 5%,rgba(128,100,230,.14),transparent 29%),radial-gradient(circle at 9% 76%,rgba(76,158,226,.10),transparent 31%),#10121d; }
.friends-page .search-input-wrap { position:relative; display:flex; align-items:center; gap:8px; width:min(92%,680px); margin:15px auto 5px; padding:8px 11px; border:1px solid rgba(204,194,245,.15); border-radius:17px; background:rgba(255,255,255,.045); box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 10px 23px rgba(0,0,0,.12); }
.friends-page .search-input-wrap .qrcode-dummy { order:3; display:grid; place-items:center; width:34px; height:34px; margin:0; border:1px solid rgba(201,181,255,.22); border-radius:11px; background:rgba(134,104,232,.16); color:#d9ccff; transition:transform .16s ease,background .16s ease; }
.friends-page .search-input-wrap .qrcode-dummy:hover { transform:translateY(-1px); background:rgba(143,112,237,.28); }
.friends-page .search-input-wrap .friend-search-mark { display:grid; place-items:center; width:28px; height:28px; color:#b7a8eb; font-size:19px; }
.friends-page .search-input-wrap .search-input { min-height:34px; font-size:13px; font-weight:620; }
.friends-shell { display:block; width:min(92%,680px); margin:8px auto 31px; }
.friends-page .friends-overview { display:flex; align-items:center; gap:10px; margin:15px 2px 9px; padding:0 2px; }
.friends-page .friends-overview-mark { display:grid; place-items:center; width:34px; height:34px; border:1px solid rgba(176,210,255,.20); border-radius:12px; background:linear-gradient(145deg,rgba(91,165,229,.24),rgba(112,88,195,.18)); color:#d4ecff; box-shadow:inset 0 1px 0 rgba(255,255,255,.13); }
.friends-page .friends-overview-mark .material-icons { font-size:19px; }
.friends-page .friends-overview div { display:grid; gap:1px; min-width:0; }.friends-page .friends-overview strong { overflow:hidden; color:#f4f1ff; font-size:14px; font-weight:780; text-overflow:ellipsis; white-space:nowrap; }.friends-page .friends-overview span { color:#aaa5bd; font-size:10px; font-weight:730; letter-spacing:.045em; text-transform:uppercase; }
.friends-page .friends-list { width:100%; margin:0; }
.friends-page .friends-list .md-subheader { display:none; }
.friends-page .lup-user-list { display:grid; gap:8px; }
.friends-page .lup-user-list md-list-item.friend-card { min-height:76px; margin:0; padding:10px 12px; border:1px solid rgba(210,203,239,.11); border-radius:17px; background:linear-gradient(135deg,rgba(255,255,255,.058),rgba(115,95,180,.055)); box-shadow:inset 0 1px 0 rgba(255,255,255,.075); }
.friends-page .lup-user-list md-list-item.friend-card:hover { transform:translateY(-1px); border-color:rgba(186,169,242,.33); background:linear-gradient(135deg,rgba(129,105,220,.16),rgba(61,129,196,.08)); }
.friends-page .lup-user-list md-list-item.friend-card .lup-avatar { width:43px; height:43px; margin-right:10px; border:1px solid rgba(213,204,250,.20); box-shadow:0 5px 13px rgba(0,0,0,.18); }
.friends-page .lup-user-list md-list-item.friend-card .username { font-size:14px; font-weight:780; }.friends-page .lup-user-list md-list-item.friend-card .lup-user-status { font-size:11px; }
.friends-page .lup-user-actions { gap:6px; margin-left:9px; padding-left:9px; border-left:1px solid rgba(255,255,255,.08); }
.friends-page .lup-user-action { width:35px; height:35px; border-radius:11px; box-shadow:inset 0 1px 0 rgba(255,255,255,.11); }
.friends-page .lup-user-action .material-icons { font-size:18px; }
.friends-page .lup-user-action-message { border-color:rgba(166,185,255,.30); background:linear-gradient(145deg,rgba(129,106,227,.24),rgba(70,129,203,.16)); color:#e2dcff; }
.friends-page .lup-user-action-remove { border-color:rgba(241,180,203,.18); background:rgba(192,105,137,.08); color:#e4b6c8; }
.friends-page .lup-user-action-remove:hover { border-color:rgba(250,192,214,.38); background:rgba(202,109,142,.17); }
.friends-page .friends-empty { display:grid; justify-items:center; gap:7px; padding:42px 20px; border:1px dashed rgba(197,184,242,.20); border-radius:20px; background:rgba(255,255,255,.025); color:#c8c1d9; text-align:center; }.friends-page .friends-empty .material-icons { display:grid; place-items:center; width:42px; height:42px; border-radius:15px; background:rgba(126,99,219,.15); color:#cbbdff; font-size:23px; }.friends-page .friends-empty strong { color:#eeeaff; font-size:14px; }.friends-page .friends-empty span { max-width:250px; color:#aaa4bd; font-size:12px; line-height:1.45; }
@media (max-width:380px) { .friends-page .search-input-wrap,.friends-shell { width:94%; }.friends-page .lup-user-list md-list-item.friend-card { padding-right:9px; padding-left:9px; }.friends-page .lup-user-actions { gap:4px; margin-left:5px; padding-left:6px; }.friends-page .lup-user-action { width:32px; height:32px; }.friends-page .lup-user-action .material-icons { font-size:16px; } }

/* Inbox uses the same quiet place field as Friends: a single landmark helps
   orientation while conversations and events remain the visual priority. */
.notification > md-content { position:relative; isolation:isolate; overflow-x:hidden; background:radial-gradient(ellipse at 92% 8%,rgba(107,150,237,.13),transparent 31%),radial-gradient(ellipse at 8% 84%,rgba(115,83,198,.13),transparent 35%),linear-gradient(160deg,#101726 0%,#101421 49%,#131225 100%); }
.notification > md-content > :not(.inbox-ambient-map) { position:relative; z-index:1; }
.inbox-ambient-map { position:absolute; z-index:0; inset:0; overflow:hidden; pointer-events:none; }
.inbox-ambient-map::before { content:''; position:absolute; top:11%; right:-38%; width:94%; height:52%; border:1px solid rgba(127,185,255,.095); border-radius:48% 52% 50% 47%; transform:rotate(-24deg); }.inbox-ambient-map::after { content:''; position:absolute; bottom:5%; left:-43%; width:103%; height:48%; border:1px solid rgba(173,133,255,.08); border-radius:52% 48% 44% 56%; transform:rotate(18deg); }
.inbox-route { position:absolute; display:block; width:72%; height:29%; border:1px solid rgba(143,190,255,.095); border-radius:50%; opacity:.72; }.inbox-route-one { top:27%; right:-29%; transform:rotate(-29deg); }.inbox-route-two { bottom:6%; left:-39%; border-color:rgba(185,149,255,.075); transform:rotate(21deg); }
.inbox-route-light { position:absolute; top:31%; right:13%; width:7px; height:7px; border-radius:50%; background:#bce9ff; box-shadow:0 0 0 4px rgba(111,190,244,.06),0 0 15px rgba(108,197,255,.68); animation:lup-inbox-route-light 18s ease-in-out infinite; }.inbox-map-node { position:absolute; width:4px; height:4px; border-radius:50%; background:rgba(201,226,255,.58); box-shadow:0 0 11px rgba(117,194,255,.38); }.inbox-map-node-one { top:44%; right:29%; opacity:.38; }.inbox-map-node-two { bottom:22%; left:17%; background:rgba(204,178,255,.52); opacity:.33; }
.inbox-map-pin { position:absolute; top:18%; right:6%; display:grid; place-items:center; width:50px; height:50px; border:1px solid rgba(158,210,255,.15); border-radius:50% 50% 50% 13px; background:linear-gradient(145deg,rgba(83,168,229,.12),rgba(113,84,196,.08)); box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 12px 30px rgba(19,58,109,.14); color:rgba(198,238,255,.56); transform:rotate(-45deg); animation:lup-inbox-pin-drift 16s ease-in-out infinite; }.inbox-map-pin .material-icons { font-size:27px; transform:rotate(45deg); filter:drop-shadow(0 3px 6px rgba(79,181,243,.34)); }
.notification .notification-panel { background:transparent; }.notification .notification-panel > md-content { background:transparent; }.notification .notification-panel md-list { background:transparent; }
.notification .inbox-empty { display:flex; align-items:center; min-height:92px; margin:18px 14px; padding:13px 14px; border:1px solid rgba(184,205,245,.14); border-radius:19px; background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(108,91,185,.065)); box-shadow:inset 0 1px 0 rgba(255,255,255,.075); }.notification .inbox-empty .inbox-empty-mark { display:grid; flex:0 0 42px; place-items:center; width:42px; height:42px; margin-right:11px; border:1px solid rgba(169,200,255,.20); border-radius:14px 14px 14px 5px; background:linear-gradient(145deg,rgba(91,165,229,.19),rgba(112,88,195,.13)); color:#d5ecff; }.notification .inbox-empty .inbox-empty-mark .material-icons { font-size:21px; }.notification .inbox-empty .md-list-item-text { min-width:0; }.notification .inbox-empty strong { display:block; margin:0 0 4px; color:#edf2ff; font-size:13px; font-weight:780; }.notification .inbox-empty p { margin:0; color:#afaac0; font-size:11px; line-height:1.4; }
@keyframes lup-inbox-pin-drift { 0%,100% { transform:rotate(-45deg) translate3d(0,0,0); opacity:.36; } 50% { transform:rotate(-45deg) translate3d(-8px,10px,0); opacity:.61; } }
@keyframes lup-inbox-route-light { 0%,100% { transform:translate3d(0,0,0); opacity:.18; } 48%,52% { transform:translate3d(-72px,31px,0); opacity:.66; } }
@media (max-width:480px) { .inbox-map-pin { top:20%; right:-1%; width:42px; height:42px; }.inbox-map-pin .material-icons { font-size:23px; }.inbox-route-light { top:32%; right:7%; }.inbox-route-one { top:28%; right:-44%; width:89%; }.notification .inbox-empty { margin-right:12px; margin-left:12px; } }
@media (prefers-reduced-motion:reduce) { .inbox-route-light,.inbox-map-pin { animation:none; } }

/* The inbox switch is two direct choices, not a dark framed component. */
.notification .notification-switch { margin:0; padding-top:7px; padding-bottom:6px; border:0; background:transparent; box-shadow:none; }
.notification .notification-switch::before,.notification .notification-switch::after { display:none; content:none; }
.notification .notification-switch button { border:0; box-shadow:none; }
.notification .notification-switch button.active { background:linear-gradient(145deg,rgba(98,141,215,.16),rgba(116,86,190,.12)); box-shadow:inset 0 1px 0 rgba(219,234,255,.07); }

/* Empty inbox is guidance, not another heavy framed card. */
.notification md-list > .inbox-empty,.notification .inbox-empty { display:flex; align-items:center; min-height:76px; margin:22px 14px 0; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
.notification .inbox-empty .inbox-empty-mark { border:0; border-radius:0; background:transparent; box-shadow:none; color:#b8dcff; }
.notification .inbox-empty .inbox-empty-copy { min-width:0; border:0; background:transparent; box-shadow:none; }
.notification .notification-panel .inbox-message-list { margin:0; padding:0; background:transparent; background-color:transparent; box-shadow:none; }
.notification .notification-panel .inbox-message-list::before,.notification .notification-panel .inbox-message-list::after { display:none; content:none; }
.notification .notification-panel ng-include,.notification .notification-panel ng-include > md-content,.notification .notification-panel ng-include md-content { background:transparent; background-color:transparent; box-shadow:none; }

/* Private-message threads are people and conversations, not Material list rows.
   The left signal is reserved for unread activity; the right bubble opens the
   same conversation without adding a second, visually noisy chevron. */
.notification .notification-panel .inbox-message-list .inbox-thread-card {
  position:relative;
  display:flex;
  align-items:center;
  min-height:72px;
  margin:8px 12px;
  padding:10px 10px 10px 13px;
  border:1px solid rgba(186,208,250,.12);
  border-radius:17px;
  background:linear-gradient(110deg,rgba(70,89,145,.19),rgba(20,28,47,.48) 66%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 8px 18px rgba(2,7,20,.12);
  cursor:pointer;
  transition:transform 170ms ease,border-color 170ms ease,background 170ms ease,box-shadow 170ms ease;
}
.notification .notification-panel .inbox-message-list .inbox-thread-card::before {
  content:'';
  position:absolute;
  top:14px;
  bottom:14px;
  left:0;
  width:2px;
  border-radius:0 3px 3px 0;
  background:rgba(142,202,255,.28);
}
.notification .notification-panel .inbox-message-list .inbox-thread-card:hover,
.notification .notification-panel .inbox-message-list .inbox-thread-card:focus-within {
  transform:translateY(-1px);
  border-color:rgba(167,211,255,.28);
  background:linear-gradient(110deg,rgba(81,112,178,.27),rgba(25,35,58,.58) 66%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 11px 22px rgba(2,7,20,.17);
}
.notification .notification-panel .inbox-message-list .inbox-thread-card.lup-notification-unread::before {
  background:#91e1bd;
  box-shadow:0 0 12px rgba(112,226,169,.70);
}
.notification .inbox-thread-avatar {
  position:relative;
  flex:0 0 auto;
  width:45px;
  height:45px;
  margin-right:12px;
}
.notification .inbox-thread-avatar .lup-avatar,
.notification .inbox-thread-avatar .lup-avatar img { width:45px; height:45px; }
.notification .inbox-thread-avatar .lup-avatar {
  display:block;
  border-radius:50%;
  outline:1px solid rgba(161,215,255,.38);
  outline-offset:3px;
  overflow:hidden;
}
.notification .inbox-thread-live {
  position:absolute;
  z-index:2;
  right:-3px;
  bottom:0;
  width:9px;
  height:9px;
  border:2px solid #172038;
  border-radius:50%;
  background:#8ce4b5;
  box-shadow:0 0 10px rgba(115,232,174,.78);
}
.notification .inbox-thread-copy { min-width:0; flex:1 1 auto; margin:0; }
.notification .inbox-thread-titleline { display:flex; align-items:center; gap:8px; min-width:0; }
.notification .inbox-thread-copy h4 { min-width:0; margin:0; overflow:hidden; color:#f2f6ff; font-size:13px; font-weight:760; line-height:1.25; text-overflow:ellipsis; white-space:nowrap; }
.notification .inbox-thread-copy p { margin:4px 0 0; overflow:hidden; color:#aab7ce; font-size:11px; line-height:1.25; text-overflow:ellipsis; white-space:nowrap; }
.notification .inbox-thread-unread { display:grid; flex:0 0 auto; place-items:center; min-width:18px; height:18px; padding:0 5px; border-radius:10px; background:rgba(112,220,168,.17); color:#caffdf; font-size:9px; font-weight:850; line-height:1; }
.notification .inbox-thread-open {
  display:grid;
  flex:0 0 auto;
  place-items:center;
  width:34px;
  height:34px;
  min-width:34px;
  margin:0 0 0 9px;
  padding:0;
  border:1px solid rgba(178,162,255,.27);
  border-radius:11px;
  background:linear-gradient(145deg,rgba(139,111,230,.26),rgba(83,122,198,.15));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
  color:#e4dcff;
  cursor:pointer;
  transition:transform 160ms ease,filter 160ms ease;
}
.notification .inbox-thread-open:hover,.notification .inbox-thread-open:focus-visible { transform:translateY(-1px); filter:brightness(1.15); outline:0; }
.notification .inbox-thread-open .material-icons { font-size:18px; }
@media (max-width:360px) { .notification .notification-panel .inbox-message-list .inbox-thread-card { margin-right:9px; margin-left:9px; padding-right:8px; padding-left:11px; } .notification .inbox-thread-avatar,.notification .inbox-thread-avatar .lup-avatar,.notification .inbox-thread-avatar .lup-avatar img { width:39px; height:39px; } .notification .inbox-thread-avatar { margin-right:10px; } .notification .inbox-thread-open { width:31px; height:31px; min-width:31px; margin-left:6px; } }

/* A private conversation must not inherit any of Material's paper surfaces.
   The message area and composer stay legible on the same night-blue base. */
.query-page > md-content,.query-page > md-content > ng-include,.query-page > md-content md-content { background:transparent; color:#eef2ff; }
.query-page > md-content { background:radial-gradient(ellipse at 92% 8%,rgba(107,150,237,.13),transparent 31%),radial-gradient(ellipse at 8% 84%,rgba(115,83,198,.09),transparent 35%),linear-gradient(160deg,#101726 0%,#101421 49%,#131225 100%); }
.query-page .chat-msgs { background:linear-gradient(180deg,rgba(16,20,34,.18),rgba(10,13,24,.62)); }
.query-page .chatbottom { background:linear-gradient(180deg,rgba(13,17,29,.78),rgba(13,16,27,.96)); }
.query-page .chatbottom .chat-input { border:1px solid rgba(180,202,245,.14); border-radius:12px; background:rgba(38,43,65,.72); box-shadow:inset 0 1px 0 rgba(255,255,255,.055); }
.query-page .chatbottom input { border:0; border-radius:12px; background:transparent; color:#f4f6ff; -webkit-text-fill-color:#f4f6ff; }
.query-page .chatbottom input::placeholder { color:#a9b3cd; }.query-page .chatbottom input:focus { border:0; box-shadow:0 0 0 2px rgba(137,184,255,.14); }
.query-page .chatbottom input:-webkit-autofill,.query-page .chatbottom input:-webkit-autofill:hover,.query-page .chatbottom input:-webkit-autofill:focus { -webkit-text-fill-color:#f4f6ff; -webkit-box-shadow:0 0 0 1000px #282d43 inset; transition:background-color 9999s ease-in-out 0s; }

/* Private conversation — each message gets one continuous, edge-to-edge row.
   The avatar is a real column now, so it can never drift inside the text. */
.query-page .chat-msgs { padding:0; }
.query-page .chat-msgs .msgline { width:100%; }
.query-page .chat-msgs .lup-msg {
  width:100%;
  margin:0;
  border-bottom:1px solid rgba(192,210,247,.075);
}
.query-page .chat-msgs .lup-msg:last-child { border-bottom:0; }
.query-page .query-message-card {
  display:flex;
  align-items:center;
  gap:11px;
  width:100%;
  min-height:60px;
  box-sizing:border-box;
  margin:0;
  padding:11px 14px;
}
.query-page .query-message-avatar,
.query-page .query-message-avatar .avatar,
.query-page .query-message-avatar img {
  display:block;
  flex:0 0 38px;
  width:38px;
  height:38px;
  margin:0;
  border-radius:50%;
}
.query-page .query-message-avatar {
  overflow:hidden;
  border:1px solid rgba(191,215,255,.22);
  box-shadow:0 4px 14px rgba(0,0,0,.18);
  cursor:pointer;
}
.query-page .query-message-content { flex:1 1 auto; min-width:0; }
.query-page .query-message-meta {
  display:flex;
  align-items:baseline;
  gap:7px;
  min-width:0;
  margin:0 0 3px;
}
.query-page .query-message-meta .name {
  overflow:hidden;
  color:#e8efff;
  font-size:11px;
  font-weight:750;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.query-page .query-message-meta .time {
  flex:0 0 auto;
  color:#8e9bb7;
  font-size:9px;
  line-height:1.2;
  white-space:nowrap;
}
.query-page .query-message-content .message {
  display:block;
  width:100%;
  box-sizing:border-box;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:#cbd5e7;
  font-size:12px;
  line-height:1.45;
  overflow-wrap:anywhere;
}
.query-page .query-message-content .messager-inner { display:inline; float:none; padding:0; }
.query-page .query-message-content lup-msg-state { display:inline-flex; margin-left:5px; vertical-align:middle; }
.query-page .lup-own-msg .query-message-card { flex-direction:row-reverse; }
.query-page .lup-own-msg .query-message-meta { justify-content:flex-end; }
.query-page .lup-own-msg .query-message-content { text-align:right; }
.query-page .lup-own-msg .query-message-content .message { color:#e4ebff; }
@media (max-width:360px) {
  .query-page .query-message-card { gap:9px; padding:10px 11px; }
  .query-page .query-message-avatar,.query-page .query-message-avatar .avatar,.query-page .query-message-avatar img { flex-basis:34px; width:34px; height:34px; }
}

/* Friends shares LinkUUp's sense of place: one quiet map field and one
   orientation pin.  It is deliberately behind every actionable surface. */
.friends-page > md-content { position:relative; isolation:isolate; overflow-x:hidden; background:radial-gradient(ellipse at 92% 9%,rgba(107,150,237,.13),transparent 31%),radial-gradient(ellipse at 8% 84%,rgba(115,83,198,.13),transparent 35%),linear-gradient(160deg,#101726 0%,#101421 49%,#131225 100%); }
.friends-page > md-content > :not(.friends-ambient-map) { position:relative; z-index:1; }
.friends-ambient-map { position:absolute; z-index:0; inset:0; overflow:hidden; pointer-events:none; }
.friends-ambient-map::before { content:''; position:absolute; top:8%; right:-36%; width:92%; height:54%; border:1px solid rgba(127,185,255,.10); border-radius:48% 52% 50% 47%; transform:rotate(-23deg); opacity:.78; }
.friends-ambient-map::after { content:''; position:absolute; bottom:10%; left:-45%; width:104%; height:48%; border:1px solid rgba(173,133,255,.085); border-radius:52% 48% 44% 56%; transform:rotate(17deg); }
.friends-route { position:absolute; display:block; width:72%; height:29%; border:1px solid rgba(143,190,255,.10); border-radius:50%; opacity:.72; }
.friends-route-one { top:25%; right:-29%; transform:rotate(-29deg); }
.friends-route-two { bottom:4%; left:-39%; border-color:rgba(185,149,255,.08); transform:rotate(21deg); }
.friends-route-light { position:absolute; top:30%; right:12%; width:7px; height:7px; border-radius:50%; background:#bce9ff; box-shadow:0 0 0 4px rgba(111,190,244,.06),0 0 15px rgba(108,197,255,.68); opacity:.48; animation:lup-friends-route-light 18s ease-in-out infinite; }
.friends-map-node { position:absolute; width:4px; height:4px; border-radius:50%; background:rgba(201,226,255,.62); box-shadow:0 0 11px rgba(117,194,255,.42); }
.friends-map-node-one { top:42%; right:30%; opacity:.42; }.friends-map-node-two { bottom:24%; left:17%; background:rgba(204,178,255,.55); opacity:.35; }
.friends-map-pin { position:absolute; top:18%; right:6%; display:grid; place-items:center; width:50px; height:50px; border:1px solid rgba(158,210,255,.16); border-radius:50% 50% 50% 13px; background:linear-gradient(145deg,rgba(83,168,229,.13),rgba(113,84,196,.085)); box-shadow:inset 0 1px 0 rgba(255,255,255,.11),0 12px 30px rgba(19,58,109,.15); color:rgba(198,238,255,.60); transform:rotate(-45deg); animation:lup-friends-pin-drift 16s ease-in-out infinite; }
.friends-map-pin .material-icons { font-size:27px; transform:rotate(45deg); filter:drop-shadow(0 3px 6px rgba(79,181,243,.36)); }
@keyframes lup-friends-pin-drift { 0%,100% { transform:rotate(-45deg) translate3d(0,0,0); opacity:.39; } 50% { transform:rotate(-45deg) translate3d(-8px,10px,0); opacity:.64; } }
@keyframes lup-friends-route-light { 0%,100% { transform:translate3d(0,0,0); opacity:.20; } 48% { transform:translate3d(-72px,31px,0); opacity:.70; } 52% { transform:translate3d(-72px,31px,0); opacity:.70; } }
@media (max-width:480px) { .friends-map-pin { top:20%; right:-1%; width:42px; height:42px; }.friends-map-pin .material-icons { font-size:23px; }.friends-route-light { top:31%; right:7%; }.friends-route-one { top:27%; right:-44%; width:89%; } }
@media (prefers-reduced-motion:reduce) { .friends-route-light,.friends-map-pin { animation:none; } }

/* Friends v3: one calm connection lane. The people remain the focus; search
   and actions are deliberately compact so the top of the phone is not crowded. */
.friends-page .lup-top-bar {
  background:rgba(15,20,33,.84);
  border-bottom-color:rgba(206,222,255,.08);
  box-shadow:none;
}
.friends-page .friends-search-zone,
.friends-page .friends-shell {
  width:min(92%,680px);
  box-sizing:border-box;
}
.friends-page .friends-search-zone {
  position:relative;
  z-index:1;
  margin:18px auto 0;
}
.friends-page .search-input-wrap {
  width:100%;
  min-height:48px;
  margin:0;
  padding:4px 5px 4px 13px;
  border:1px solid rgba(198,216,255,.12);
  border-radius:15px;
  background:rgba(12,17,29,.42);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055);
}
.friends-page .search-input-wrap:focus-within {
  border-color:rgba(147,191,255,.43);
  background:rgba(18,25,42,.58);
  box-shadow:0 0 0 3px rgba(96,156,243,.08),inset 0 1px 0 rgba(255,255,255,.055);
}
.friends-page .search-input-wrap .friend-search-mark {
  width:22px;
  color:rgba(190,218,255,.72);
  font-size:18px;
}
.friends-page .search-input-wrap .search-input {
  min-height:38px;
  padding:0 2px;
  color:#f1f4ff;
  font-size:14px;
  font-weight:620;
}
.friends-page .search-input-wrap .search-input::placeholder { color:rgba(191,200,224,.70); }
.friends-page .search-input-wrap .qrcode-dummy {
  order:3;
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  margin:0;
  padding:0;
  border:0;
  border-radius:11px;
  background:transparent;
  box-shadow:none;
  color:#aebfff;
  cursor:pointer;
  transition:color .18s ease,background .18s ease,transform .18s ease;
}
.friends-page .search-input-wrap .qrcode-dummy:hover,
.friends-page .search-input-wrap .qrcode-dummy:focus-visible {
  background:rgba(131,153,242,.15);
  color:#e4e9ff;
  outline:0;
  transform:translateY(-1px);
}
.friends-page .search-input-wrap .qrcode-dummy .material-icons { font-size:20px; }
.friends-page .friends-shell { margin:18px auto 34px; }
.friends-page .friends-overview {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:16px;
  margin:0 2px 12px;
  padding:0 2px 13px;
  border-bottom:1px solid rgba(198,216,255,.13);
}
.friends-page .friends-overview-copy { display:grid; gap:3px; min-width:0; }
.friends-page .friends-overview-eyebrow {
  color:#91c6ef;
  font-size:9px;
  font-weight:820;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.friends-page .friends-overview strong {
  overflow:hidden;
  color:#f4f6ff;
  font-size:clamp(19px,5vw,25px);
  font-weight:760;
  letter-spacing:-.045em;
  line-height:1.03;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.friends-page .friends-overview-description {
  overflow:hidden;
  color:#aeb5ca;
  font-size:11px;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.friends-page .friends-overview-count {
  display:grid;
  justify-items:end;
  gap:1px;
  min-width:55px;
  padding:0 0 1px;
  color:#bfc9e7;
  text-align:right;
}
.friends-page .friends-overview-count b {
  color:#e5e8ff;
  font-size:22px;
  font-weight:720;
  letter-spacing:-.065em;
  line-height:1;
}
.friends-page .friends-overview-count small {
  color:#92a1c3;
  font-size:8px;
  font-weight:760;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.friends-page .friends-list {
  overflow:hidden;
  width:100%;
  margin:0;
  padding:0;
  border-top:1px solid rgba(198,216,255,.10);
  border-bottom:1px solid rgba(198,216,255,.10);
  border-radius:0;
  background:linear-gradient(90deg,rgba(255,255,255,.018),rgba(126,109,193,.028),rgba(255,255,255,.012));
  box-shadow:none;
}
.friends-page .friends-list .md-subheader { display:none; }
.friends-page .lup-user-list { display:block; }
.friends-page .lup-user-list md-list-item.friend-card,
.friends-page .friend-search-results md-list-item {
  min-height:69px;
  margin:0;
  padding:9px 5px;
  border:0;
  border-bottom:1px solid rgba(198,216,255,.09);
  border-radius:0;
  background:transparent;
  box-shadow:none;
  transition:background .18s ease,transform .18s ease;
}
.friends-page .lup-user-list md-list-item.friend-card:last-child,
.friends-page .friend-search-results md-list-item:last-child { border-bottom:0; }
.friends-page .lup-user-list md-list-item.friend-card:hover,
.friends-page .friend-search-results md-list-item:hover {
  transform:none;
  border-color:rgba(198,216,255,.09);
  background:linear-gradient(90deg,rgba(121,167,238,.09),rgba(137,106,218,.035));
}
.friends-page .lup-user-list md-list-item.friend-card .lup-avatar,
.friends-page .friend-search-results lup-avatar {
  width:43px;
  height:43px;
  margin:0 11px 0 5px;
  border:1px solid rgba(205,222,255,.18);
  border-radius:50%;
  box-shadow:0 5px 15px rgba(0,0,0,.16);
}
.friends-page .lup-user-list .username,
.friends-page .friend-search-results .username {
  margin:0 0 3px;
  color:#eef2ff;
  font-size:14px;
  font-weight:740;
}
.friends-page .lup-user-list .lup-user-status,
.friends-page .friend-search-results .lup-user-status {
  margin:0;
  color:#9fa8bf;
  font-size:11px;
}
.friends-page .lup-user-actions {
  gap:2px;
  margin-left:7px;
  padding-left:7px;
  border-left:1px solid rgba(198,216,255,.08);
}
.friends-page .lup-user-action {
  width:34px;
  height:34px;
  border:0;
  border-radius:10px;
  background:transparent;
  box-shadow:none;
}
.friends-page .lup-user-action .material-icons { font-size:18px; }
.friends-page .lup-user-action-message { color:#bfcbff; }
.friends-page .lup-user-action-message:hover { background:rgba(118,155,238,.15); color:#e1e8ff; }
.friends-page .lup-user-action-remove { color:#d8a7ba; }
.friends-page .lup-user-action-remove:hover { border-color:transparent; background:rgba(205,110,143,.12); color:#f0c0d0; }
.friends-page .lup-user-action-friend { color:#a9e8c7; }
.friends-page .lup-user-action-friend:hover { background:rgba(91,193,142,.16); color:#d8ffea; }
.friends-page .lup-user-action-friend-pending { color:#f0ca8a; }
.friends-page .lup-user-action-friend-pending:hover { background:rgba(218,166,82,.15); color:#ffe1ae; }
.friends-page .friend-search-results {
  overflow:hidden;
  width:100%;
  margin:8px 0 0;
  padding:0;
  border-top:1px solid rgba(198,216,255,.10);
  border-bottom:1px solid rgba(198,216,255,.10);
  background:rgba(12,17,29,.32);
}
.friends-page .friends-empty {
  border:0;
  border-top:1px solid rgba(198,216,255,.10);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
@media (max-width:380px) {
  .friends-page .friends-search-zone,.friends-page .friends-shell { width:94%; }
  .friends-page .friends-overview { gap:10px; }
  .friends-page .friends-overview-description { max-width:218px; }
  .friends-page .lup-user-actions { margin-left:3px; padding-left:4px; }
  .friends-page .lup-user-action { width:31px; height:31px; }
}

/* Final, deliberately quiet review surface.  The interaction is the focus:
   place, score, voices, then one obvious action to leave a rating. */
.location-reviews-page > md-content {
  background:linear-gradient(160deg,#151824 0%,#10121d 100%);
}
.reviews-hero {
  grid-template-columns:42px minmax(0,1fr);
  gap:11px;
  margin:14px 14px 10px;
  padding:14px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:15px;
  background:rgba(255,255,255,.035);
  box-shadow:none;
}
.reviews-hero::after { display:none; }
.reviews-hero-mark {
  width:40px;
  height:40px;
  border:1px solid rgba(188,174,255,.30);
  border-radius:12px;
  background:rgba(138,112,237,.16);
  box-shadow:none;
  color:#cdbfff;
}
.reviews-hero-mark .material-icons { font-size:22px; }
.reviews-hero-copy > span { color:#aaa4c7; font-size:8px; }
.reviews-hero-copy h1 { font-size:16px; font-weight:700; }
.reviews-hero-copy p { color:#b9b5c7; font-size:11px; }
.reviews-rate-cta {
  min-height:40px;
  margin-top:1px;
  border:1px solid rgba(184,169,247,.26);
  border-radius:11px;
  background:rgba(137,112,232,.14);
  box-shadow:none;
}
.reviews-scoreboard {
  margin:0 14px 12px;
  padding:11px 13px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  background:rgba(255,255,255,.03);
  box-shadow:none;
}
.reviews-score { min-width:62px; }
.reviews-score strong { font-size:24px; }
.location-reviews-page md-list { padding:0 14px 25px; }
.location-reviews-page md-list-item {
  margin:7px 0;
  padding:8px 10px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:13px;
  background:rgba(255,255,255,.025);
  box-shadow:none;
}
.location-reviews-page md-list-item .lup-comment-text { color:#f2f0f7; }
.location-reviews-page .review-comment-rating { display:flex; align-items:center; gap:1px; margin-top:5px; }.location-reviews-page .review-comment-rating .material-icons { color:rgba(255,255,255,.17); font-size:14px; }.location-reviews-page .review-comment-rating .material-icons.is-rated { color:#ffd36e; }.location-reviews-page .review-comment-rating span { margin-left:5px; color:#a9a4b8; font-size:9px; font-weight:700; }
.location-reviews-page .reviews-empty { display:flex; align-items:center; gap:9px; min-height:64px; color:#aaa6b8; font-size:11px; line-height:1.4; }.location-reviews-page .reviews-empty .material-icons { color:#b7a8ef; }
@media (max-width:420px) {
  .reviews-hero,.reviews-scoreboard { margin-right:10px; margin-left:10px; }
  .location-reviews-page md-list { padding-right:10px; padding-left:10px; }
}

/* Venue view: a clean, useful destination page.  The five stars are plain
   Material icons on one fixed row, so they can never wrap into a 3+2 block. */
.venue-view { --venue-accent:#bba8ff; --venue-glow:rgba(154,127,241,.24); background:radial-gradient(circle at 86% 0,var(--venue-glow),transparent 30%),linear-gradient(160deg,#171a29,#10121c); }
.venue-view.location-category-city { --venue-accent:#8ec9ff; --venue-glow:rgba(94,175,243,.26); }
.venue-view.location-category-bar,.venue-view.location-category-food { --venue-accent:#f1a76e; --venue-glow:rgba(226,126,70,.26); }
.venue-view.location-category-cafe { --venue-accent:#e2b47d; --venue-glow:rgba(198,143,93,.24); }
.venue-view.location-category-club { --venue-accent:#e58bdb; --venue-glow:rgba(211,81,203,.24); }
.venue-view.location-category-culture { --venue-accent:#86c6ed; --venue-glow:rgba(80,165,226,.22); }
.venue-view.location-category-sport,.venue-view.location-category-outdoors { --venue-accent:#85d5a4; --venue-glow:rgba(71,188,128,.22); }
.venue-view.location-category-education { --venue-accent:#89d4e5; --venue-glow:rgba(73,182,202,.22); }
.venue-view.location-category-health { --venue-accent:#ef9ab3; --venue-glow:rgba(224,98,142,.22); }
.venue-identity { display:grid; grid-template-columns:52px minmax(0,1fr) 36px; align-items:center; gap:12px; min-height:108px; padding:16px; border-bottom:1px solid color-mix(in srgb,var(--venue-accent) 20%,rgba(255,255,255,.08)); background:linear-gradient(115deg,color-mix(in srgb,var(--venue-accent) 13%,#24283a),rgba(19,21,33,.95) 72%); }
.venue-category-mark { display:grid; place-items:center; width:50px; height:50px; border:1px solid color-mix(in srgb,var(--venue-accent) 55%,rgba(255,255,255,.18)); border-radius:15px 15px 15px 6px; background:linear-gradient(145deg,color-mix(in srgb,var(--venue-accent) 38%,#596074),#262a3b); box-shadow:0 10px 22px rgba(0,0,0,.22),0 0 20px var(--venue-glow),inset 0 1px rgba(255,255,255,.28); color:#fff; }.venue-category-mark .material-icons { font-size:28px; }
.venue-title { min-width:0; }.venue-title > span { display:block; overflow:hidden; color:var(--venue-accent); font-size:9px; font-weight:800; letter-spacing:.1em; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; }.venue-title h1 { display:-webkit-box; overflow:hidden; margin:3px 0 4px; color:#f8f6fc; font-size:20px; font-weight:720; line-height:1.08; -webkit-box-orient:vertical; -webkit-line-clamp:2; }.venue-title p { overflow:hidden; margin:0; color:#b5b2c1; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.venue-hours { display:grid; place-items:center; width:36px; height:36px; padding:0; border:1px solid rgba(255,255,255,.10); border-radius:11px; background:rgba(255,255,255,.04); color:#c9c4d7; cursor:pointer; }.venue-hours .room-open { color:#82dda9; }.venue-hours .room-closed { color:#f19baa; }.venue-hours .room-unknown { color:var(--venue-accent); }
.venue-rating { display:grid; grid-template-columns:58px minmax(0,1fr) auto; align-items:center; gap:10px; width:calc(100% - 28px); min-height:66px; margin:13px 14px 10px; padding:10px 12px; border:1px solid color-mix(in srgb,var(--venue-accent) 27%,rgba(255,255,255,.11)); border-radius:15px; background:rgba(255,255,255,.035); box-shadow:inset 0 1px rgba(255,255,255,.06); color:#f5f2fa; cursor:pointer; text-align:left; }
.venue-rating-number { display:grid; gap:1px; }.venue-rating-number strong { color:#fff0ad; font-size:25px; line-height:.95; }.venue-rating-number span { color:#aaa5b8; font-size:9px; font-weight:700; }.venue-stars { display:flex; flex-wrap:nowrap; min-width:0; overflow:hidden; white-space:nowrap; }.venue-stars .material-icons { flex:0 0 auto; color:rgba(255,255,255,.18); font-size:20px; }.venue-stars .venue-star-on { color:#ffd46e; text-shadow:0 0 12px rgba(255,210,103,.18); }.venue-rating-meta { display:grid; grid-template-columns:auto auto; column-gap:3px; align-items:baseline; min-width:41px; color:#b7b2c6; }.venue-rating-meta b { color:#f1edf9; font-size:14px; }.venue-rating-meta span { font-size:8px; }.venue-rating-meta .material-icons { grid-column:1 / -1; justify-self:end; margin-top:2px; color:var(--venue-accent); font-size:16px; }
.venue-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:0 14px 14px; }.venue-action { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; min-height:84px; padding:8px 4px; border:1px solid rgba(255,255,255,.10); border-radius:14px; background:rgba(255,255,255,.03); box-shadow:inset 0 1px rgba(255,255,255,.06); color:#f1eef8; cursor:pointer; font:inherit; text-decoration:none; }.venue-action .material-icons { color:var(--venue-accent); font-size:24px; text-shadow:0 0 13px var(--venue-glow); }.venue-action span { font-size:11px; font-weight:760; }.venue-action small { overflow:hidden; max-width:100%; color:#aaa5b9; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }.venue-action-vote { border-color:color-mix(in srgb,var(--venue-accent) 31%,rgba(255,255,255,.12)); background:color-mix(in srgb,var(--venue-accent) 12%,rgba(255,255,255,.03)); }.venue-action-vote .material-icons { color:#ffe09a; }
.venue-note { display:flex; gap:8px; margin:0 14px 26px; padding:11px 12px; border-left:2px solid var(--venue-accent); background:linear-gradient(90deg,color-mix(in srgb,var(--venue-accent) 10%,transparent),transparent); color:#b8b4c4; }.venue-note .material-icons { color:var(--venue-accent); font-size:17px; }.venue-note p { margin:0; font-size:11px; line-height:1.45; }
@media (max-width:360px) { .venue-identity { grid-template-columns:45px minmax(0,1fr) 32px; gap:9px; padding:13px 10px; }.venue-category-mark { width:43px; height:43px; }.venue-title h1 { font-size:17px; }.venue-rating,.venue-actions,.venue-note { margin-right:10px; margin-left:10px; }.venue-rating { width:calc(100% - 20px); gap:7px; padding-right:9px; padding-left:9px; }.venue-stars .material-icons { font-size:17px; }.venue-action span { font-size:10px; } }

/* Venue page: the place itself stays present behind its ratings and voices. */
.venue-view { position:relative; overflow:hidden; isolation:isolate; background:radial-gradient(circle at 84% 5%,var(--venue-glow),transparent 31%),radial-gradient(circle at 10% 89%,color-mix(in srgb,var(--venue-accent) 10%,transparent),transparent 27%),linear-gradient(160deg,#171a29,#10121c); }
.venue-atmosphere { position:absolute; z-index:-1; top:12px; right:-39px; width:190px; height:190px; color:var(--venue-accent); opacity:.17; pointer-events:none; }.venue-atmosphere .material-icons { position:absolute; top:20px; right:21px; font-size:152px; line-height:1; filter:drop-shadow(0 0 22px var(--venue-glow)); }.venue-atmosphere span,.venue-atmosphere b { position:absolute; border:1px solid currentColor; border-radius:50%; }.venue-atmosphere span { inset:0; opacity:.42; }.venue-atmosphere b { inset:26px; opacity:.26; }
.venue-identity { position:relative; min-height:115px; border-bottom-color:color-mix(in srgb,var(--venue-accent) 31%,rgba(255,255,255,.08)); background:linear-gradient(112deg,color-mix(in srgb,var(--venue-accent) 20%,#202941),rgba(18,21,34,.91) 66%,rgba(17,19,31,.66)); }.venue-identity::after { content:''; position:absolute; right:0; bottom:0; left:16px; height:1px; background:linear-gradient(90deg,var(--venue-accent),transparent 72%); opacity:.7; }
.venue-rating { position:relative; min-height:71px; border-color:color-mix(in srgb,var(--venue-accent) 34%,rgba(255,255,255,.11)); background:linear-gradient(115deg,color-mix(in srgb,var(--venue-accent) 12%,rgba(255,255,255,.04)),rgba(255,255,255,.02)); }.venue-rating::after { content:'Tippe zum Bewerten'; position:absolute; right:11px; bottom:7px; color:var(--venue-accent); font-size:7px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.venue-actions { position:relative; gap:7px; }.venue-action { min-height:76px; border-color:rgba(196,218,255,.11); border-radius:16px; background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018)); transition:transform .18s ease,border-color .18s ease,background .18s ease; }.venue-action:hover { transform:translateY(-2px); border-color:color-mix(in srgb,var(--venue-accent) 42%,rgba(255,255,255,.16)); background:color-mix(in srgb,var(--venue-accent) 11%,rgba(255,255,255,.04)); }
.venue-voices { margin:3px 14px 17px; padding:15px 13px 12px; border:1px solid rgba(194,216,255,.13); border-radius:19px; background:linear-gradient(145deg,rgba(29,38,62,.82),rgba(17,22,37,.84)); box-shadow:inset 0 1px 0 rgba(255,255,255,.065),0 12px 25px rgba(0,0,0,.12); }.venue-voices-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0 0 10px; }.venue-voices-head span { display:block; color:var(--venue-accent); font-size:8px; font-weight:850; letter-spacing:.13em; }.venue-voices-head h2 { margin:3px 0 0; color:#f4f6ff; font-size:15px; line-height:1.1; }.venue-voices-head button { display:flex; align-items:center; gap:3px; padding:5px 0; border:0; background:transparent; color:#cce7ff; font:inherit; font-size:10px; font-weight:760; cursor:pointer; }.venue-voices-head button .material-icons { font-size:14px; }.venue-voice { display:grid; grid-template-columns:33px minmax(0,1fr); gap:8px; padding:10px 0; border-top:1px solid rgba(199,218,255,.09); }.venue-voice lup-avatar,.venue-voice lup-avatar .avatar,.venue-voice lup-avatar img { width:33px; height:33px; border-radius:50%; }.venue-voice lup-avatar { border:1px solid color-mix(in srgb,var(--venue-accent) 42%,rgba(255,255,255,.15)); overflow:hidden; }.venue-voice-main { min-width:0; }.venue-voice-meta { display:flex; align-items:baseline; justify-content:space-between; gap:8px; }.venue-voice-meta strong { overflow:hidden; color:#eaf2ff; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }.venue-voice-meta span { color:#8e9bb4; font-size:8px; white-space:nowrap; }.venue-voice-main p { display:-webkit-box; overflow:hidden; margin:4px 0 5px; color:#d0d8e7; font-size:11px; line-height:1.38; -webkit-box-orient:vertical; -webkit-line-clamp:3; }.venue-voice-stars { display:flex; align-items:center; gap:1px; }.venue-voice-stars .material-icons { color:rgba(255,255,255,.16); font-size:12px; }.venue-voice-stars .material-icons.is-rated { color:#ffd673; text-shadow:0 0 8px rgba(255,210,107,.22); }.venue-voice-stars small { margin-left:4px; color:#aab6cc; font-size:8px; }.venue-voices-empty { display:flex; align-items:center; gap:7px; min-height:49px; padding:4px 0; border-top:1px solid rgba(199,218,255,.09); color:#b6c1d5; font-size:10px; line-height:1.35; }.venue-voices-empty .material-icons { color:var(--venue-accent); font-size:19px; }
@media (max-width:360px) { .venue-voices { margin-right:10px; margin-left:10px; }.venue-atmosphere { transform:scale(.86); transform-origin:top right; }.venue-voice-meta span { display:none; } }

/* The location page itself is a compact reputation stage, not a passive
   directory entry. It gives a venue a reason to earn real visitor voices. */
.location-experience { background:radial-gradient(circle at 88% 3%,rgba(116,97,224,.16),transparent 29%),linear-gradient(160deg,#191b2b,#141622); }
.location-reputation { position:relative; display:grid; grid-template-columns:46px minmax(0,1fr) auto; gap:11px; align-items:center; margin:14px 13px 12px; padding:13px; overflow:hidden; border:1px solid rgba(203,194,239,.15); border-radius:18px; background:linear-gradient(125deg,rgba(93,77,160,.33),rgba(33,44,70,.74) 57%,rgba(27,30,46,.92)); box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 13px 25px rgba(0,0,0,.16); cursor:pointer; }.location-reputation::before { content:''; position:absolute; top:-50px; right:-30px; width:128px; height:128px; border:1px solid rgba(212,201,255,.15); border-radius:50%; box-shadow:0 0 0 15px rgba(142,119,236,.035); pointer-events:none; }.location-reputation > * { position:relative; z-index:1; }
.reputation-seal { display:grid; place-items:center; width:43px; height:43px; border:1px solid rgba(238,224,255,.29); border-radius:14px 14px 14px 6px; background:linear-gradient(145deg,#b095ff,#5e82d9); box-shadow:0 6px 0 rgba(62,52,131,.28),0 10px 17px rgba(0,0,0,.19),inset 0 1px 0 rgba(255,255,255,.36); color:#fff; }.reputation-seal .material-icons { font-size:25px; }
.reputation-copy { min-width:0; }.reputation-copy > span { display:block; margin-bottom:3px; color:#c6b9f5; font-size:8px; font-weight:900; letter-spacing:.14em; }.reputation-copy strong { display:block; overflow:hidden; color:#fbf9ff; font-size:13px; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }.reputation-copy small { display:block; margin-top:4px; overflow:hidden; color:#c2bed1; font-size:10px; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }
.reputation-score { display:grid; grid-template-columns:auto auto; column-gap:3px; align-items:baseline; min-width:47px; text-align:right; }.reputation-score b { color:#fff0af; font-size:20px; line-height:1; }.reputation-score > span { color:#bbb4c9; font-size:9px; font-weight:700; }.reputation-score jk-rating-stars { grid-column:1 / -1; margin-top:3px; white-space:nowrap; }.reputation-score .jk-rating-stars-container .material-icons { color:#ffd36e; font-size:10px; }
.reputation-action { grid-column:2 / -1; display:flex; align-items:center; gap:5px; margin-top:1px; color:#e7dfff; font-size:10px; font-weight:800; }.reputation-action .material-icons { color:#ffe09a; font-size:15px; }
.location-voices { margin-top:3px; padding-top:5px; }.location-voices .location-section-title > span { display:flex; align-items:center; gap:7px; color:#e9e5f3; }.location-voices .location-section-title > span .material-icons { color:#c2afff; font-size:18px; }.location-voices .location-section-title button { color:#c6b9fa; }
.location-comment-compose { display:flex; align-items:center; gap:8px; width:100%; min-height:43px; margin:0 0 9px; padding:0 12px; border:1px dashed rgba(195,181,248,.28); border-radius:13px; background:linear-gradient(100deg,rgba(127,103,221,.15),rgba(255,255,255,.025)); color:#ddd7ed; font:750 11px/1 Ubuntu,Roboto,Arial,sans-serif; cursor:pointer; }.location-comment-compose .material-icons:first-child { display:grid; place-items:center; width:25px; height:25px; border-radius:8px; background:rgba(168,145,245,.16); color:#d8caff; font-size:15px; }.location-comment-compose .material-icons:last-child { margin-left:auto; color:#b9adf0; font-size:17px; }.location-comment-compose:hover { border-color:rgba(205,191,255,.52); background:linear-gradient(100deg,rgba(137,110,232,.25),rgba(255,255,255,.045)); }
.location-voices .location-comment { border-color:rgba(209,201,239,.11); background:linear-gradient(125deg,rgba(255,255,255,.055),rgba(255,255,255,.025)); box-shadow:inset 0 1px 0 rgba(255,255,255,.06); cursor:pointer; }.location-voices .location-comment-empty { border-color:rgba(188,174,237,.20); background:rgba(117,96,192,.075); color:#bcb4cd; cursor:pointer; }
@media (max-width:380px) { .location-reputation { grid-template-columns:42px minmax(0,1fr) auto; gap:8px; margin-right:10px; margin-left:10px; padding:11px; }.reputation-seal { width:39px; height:39px; }.reputation-copy strong { font-size:12px; }.reputation-copy small { display:none; }.reputation-score b { font-size:18px; }.location-voices { margin-right:10px; margin-left:10px; } }

/* One final route pin across every viewport. Older experimental rules used
   different icon shapes before and after the mobile layout settled. */
.nearby .roominfo .distrat .distance a > .material-icons {
  display:grid;
  place-items:center;
  width:60px;
  height:60px;
  margin:0;
  border:1px solid rgba(183,232,248,.44);
  border-radius:50% 50% 50% 15px;
  background:radial-gradient(circle at 30% 23%,rgba(238,254,255,.72) 0 7%,transparent 8% 100%),linear-gradient(145deg,#78cfe2,#4386c7 64%,#344d9b);
  box-shadow:0 6px 12px rgba(29,72,137,.31),0 15px 25px rgba(0,0,0,.26),0 0 20px rgba(95,205,238,.18),inset 0 2px 1px rgba(255,255,255,.44);
  color:#fff;
  font-size:31px;
  line-height:1;
  transition:transform .2s ease,filter .2s ease;
}
.nearby .roominfo .distrat .distance a:hover > .material-icons { transform:translateY(-2px) scale(1.03); filter:brightness(1.08); }

/* Location Placeboard — one category-led place identity and exactly three
   useful actions: find it, inspect real voices, leave a five-star vote. */
.location-placeboard { --placeboard-accent:#b7a2ff; --placeboard-glow:rgba(148,118,239,.25); background:radial-gradient(circle at 83% 4%,var(--placeboard-glow),transparent 29%),linear-gradient(160deg,#171a29,#13151f); }
.location-placeboard.location-category-city { --placeboard-accent:#8fc8ff; --placeboard-glow:rgba(101,180,255,.28); }.location-placeboard.location-category-bar,.location-placeboard.location-category-food { --placeboard-accent:#f2aa72; --placeboard-glow:rgba(238,132,83,.26); }.location-placeboard.location-category-cafe { --placeboard-accent:#e2b87f; --placeboard-glow:rgba(207,151,95,.25); }.location-placeboard.location-category-club { --placeboard-accent:#ec8de3; --placeboard-glow:rgba(213,83,211,.28); }.location-placeboard.location-category-culture { --placeboard-accent:#8cc7ee; --placeboard-glow:rgba(90,172,229,.24); }.location-placeboard.location-category-sport,.location-placeboard.location-category-outdoors { --placeboard-accent:#83d2a2; --placeboard-glow:rgba(75,192,135,.24); }.location-placeboard.location-category-education { --placeboard-accent:#88d6e6; --placeboard-glow:rgba(85,189,209,.25); }.location-placeboard.location-category-health { --placeboard-accent:#f49ab2; --placeboard-glow:rgba(228,103,144,.25); }
.placeboard-hero { position:relative; display:grid; grid-template-columns:63px minmax(0,1fr) 38px; gap:12px; align-items:center; min-height:122px; padding:19px 16px 17px; overflow:hidden; border-bottom:1px solid color-mix(in srgb,var(--placeboard-accent) 22%,rgba(255,255,255,.08)); background:linear-gradient(135deg,color-mix(in srgb,var(--placeboard-accent) 15%,rgba(43,45,70,.94)),rgba(23,26,40,.96) 70%); }.placeboard-hero::after { content:''; position:absolute; right:-49px; bottom:-64px; width:176px; height:176px; border:1px solid color-mix(in srgb,var(--placeboard-accent) 22%,transparent); border-radius:50%; box-shadow:0 0 0 19px color-mix(in srgb,var(--placeboard-accent) 4%,transparent),0 0 33px var(--placeboard-glow); pointer-events:none; }.placeboard-hero > * { position:relative; z-index:1; }
.placeboard-orbit { display:grid; place-items:center; width:58px; height:58px; border:1px solid color-mix(in srgb,var(--placeboard-accent) 48%,rgba(255,255,255,.16)); border-radius:19px 19px 19px 7px; background:linear-gradient(145deg,color-mix(in srgb,var(--placeboard-accent) 41%,#626477),color-mix(in srgb,var(--placeboard-accent) 17%,#25283c)); box-shadow:0 8px 0 color-mix(in srgb,var(--placeboard-accent) 18%,rgba(23,25,43,.62)),0 14px 24px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.35); color:#fff; }.placeboard-orbit .material-icons { font-size:32px; filter:drop-shadow(0 2px 0 rgba(0,0,0,.18)); }
.placeboard-copy { min-width:0; }.placeboard-kicker { display:block; overflow:hidden; color:var(--placeboard-accent); font-size:9px; font-weight:900; letter-spacing:.13em; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; }.placeboard-copy h1 { display:-webkit-box; overflow:hidden; margin:4px 0 5px; color:#f9f7ff; font-size:21px; font-weight:780; letter-spacing:-.025em; line-height:1.05; -webkit-box-orient:vertical; -webkit-line-clamp:2; }.placeboard-copy p { overflow:hidden; margin:0; color:#bbb7c9; font-size:11px; line-height:1.3; text-overflow:ellipsis; white-space:nowrap; }
.placeboard-hours { display:grid; place-items:center; width:36px; height:36px; padding:0; border:1px solid rgba(255,255,255,.10); border-radius:11px; background:rgba(255,255,255,.045); color:#c9c4d8; cursor:pointer; }.placeboard-hours .material-icons { font-size:19px; }.placeboard-hours .room-open { color:#7ce1ae; }.placeboard-hours .room-closed { color:#ffa1ae; }.placeboard-hours .room-unknown { color:var(--placeboard-accent); }
.placeboard-score { display:grid; grid-template-columns:70px minmax(0,1fr); column-gap:11px; align-items:center; margin:14px 14px 10px; padding:12px 14px; border:1px solid color-mix(in srgb,var(--placeboard-accent) 22%,rgba(255,255,255,.10)); border-radius:16px; background:linear-gradient(105deg,color-mix(in srgb,var(--placeboard-accent) 13%,rgba(255,255,255,.045)),rgba(255,255,255,.025)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); cursor:pointer; }.placeboard-score > div { display:grid; grid-template-columns:auto auto; gap:2px; align-items:baseline; }.placeboard-score > div span { grid-column:1/-1; color:#aaa4bb; font-size:8px; font-weight:850; letter-spacing:.1em; }.placeboard-score > div strong { color:#fff0ad; font-size:25px; line-height:1; }.placeboard-score > div small { color:#bdb6ca; font-size:9px; font-weight:700; }.placeboard-score jk-rating-stars { justify-self:start; }.placeboard-score .jk-rating-stars-container .material-icons { color:#ffd36e; font-size:17px; }.placeboard-score p { grid-column:2; margin:2px 0 0; color:#aaa5bc; font-size:10px; }
.placeboard-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:0 14px 13px; }.placeboard-action { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; min-height:91px; padding:9px 4px; overflow:hidden; border:1px solid rgba(255,255,255,.10); border-radius:16px; background:rgba(255,255,255,.035); box-shadow:inset 0 1px 0 rgba(255,255,255,.07); color:#e9e6f2; font:inherit; text-decoration:none; cursor:pointer; }.placeboard-action::before { content:''; position:absolute; top:0; width:48%; height:1px; background:linear-gradient(90deg,transparent,var(--placeboard-accent),transparent); opacity:.72; }.placeboard-action .material-icons { color:var(--placeboard-accent); font-size:25px; text-shadow:0 0 12px var(--placeboard-glow); }.placeboard-action span { color:#f0edf6; font-size:11px; font-weight:800; }.placeboard-action small { overflow:hidden; max-width:100%; color:#aaa5b9; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }.placeboard-action:hover { border-color:color-mix(in srgb,var(--placeboard-accent) 43%,rgba(255,255,255,.14)); background:linear-gradient(145deg,color-mix(in srgb,var(--placeboard-accent) 17%,rgba(255,255,255,.06)),rgba(255,255,255,.04)); }.placeboard-vote { border-color:color-mix(in srgb,var(--placeboard-accent) 34%,rgba(255,255,255,.12)); background:linear-gradient(145deg,color-mix(in srgb,var(--placeboard-accent) 18%,rgba(255,255,255,.08)),rgba(255,255,255,.035)); }.placeboard-vote .material-icons { color:#ffe09a; }
.placeboard-note { display:flex; align-items:flex-start; gap:8px; margin:0 14px 28px; padding:11px 12px; border-left:2px solid var(--placeboard-accent); background:linear-gradient(90deg,color-mix(in srgb,var(--placeboard-accent) 9%,transparent),transparent 88%); color:#bbb7c8; }.placeboard-note .material-icons { flex:0 0 auto; color:var(--placeboard-accent); font-size:16px; }.placeboard-note p { margin:0; font-size:11px; line-height:1.45; }
@media (max-width:360px) { .placeboard-hero { grid-template-columns:52px minmax(0,1fr) 34px; gap:9px; padding-right:12px; padding-left:12px; }.placeboard-orbit { width:50px; height:50px; border-radius:16px 16px 16px 6px; }.placeboard-orbit .material-icons { font-size:28px; }.placeboard-copy h1 { font-size:18px; }.placeboard-score,.placeboard-actions,.placeboard-note { margin-right:10px; margin-left:10px; }.placeboard-score { padding-right:10px; padding-left:10px; }.placeboard-score .jk-rating-stars-container .material-icons { font-size:14px; }.placeboard-action span { font-size:10px; } }

/* Discovery actions are a pair: QR check-in and route use the same compact
   tile language.  Only their accent colour differs, never their depth or size. */
.nearby .roominfo .distrat .location-cuddles,
.nearby .roominfo .distrat .distance,
.nearby .roominfo .distrat .distance p,
.nearby .roominfo .distrat .distance a {
  width:56px;
  min-width:56px;
  height:56px;
  margin:0;
}
.nearby .roominfo .distrat .location-cuddles,
.nearby .roominfo .distrat .distance a > .material-icons {
  display:grid;
  place-items:center;
  box-sizing:border-box;
  width:56px;
  height:56px;
  border:1px solid rgba(205,197,244,.22);
  border-radius:14px;
  background:linear-gradient(145deg,rgba(76,72,112,.92),rgba(28,31,48,.96));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 9px 18px rgba(0,0,0,.20);
}
.nearby .roominfo .distrat .location-cuddles { color:#d6c5ff; }
.nearby .roominfo .distrat .distance a { display:grid; place-items:center; border-radius:14px; color:#c8e6ff; text-decoration:none; }
.nearby .roominfo .distrat .distance a > .material-icons { color:#9bd9ff; font-size:29px; line-height:1; transform:none; filter:none; }
.nearby .roominfo .distrat .location-cuddles > .material-icons { color:#d6c5ff; font-size:27px; line-height:1; filter:none; }
.nearby .roominfo .distrat .location-cuddles strong,
.nearby .roominfo .distrat .distance a > span {
  position:absolute;
  right:-5px;
  bottom:-5px;
  display:grid;
  place-items:center;
  min-width:18px;
  height:18px;
  padding:0 4px;
  border:1px solid rgba(205,197,244,.22);
  border-radius:999px;
  background:#202334;
  box-shadow:0 3px 8px rgba(0,0,0,.26);
  color:#f7f5ff;
  font-size:8px;
  font-weight:800;
  line-height:1;
}
.nearby .roominfo .distrat .distance a::before,
.nearby .roominfo .distrat .distance a::after { content:none; display:none; }
.nearby .roominfo .distrat .location-cuddles::before,
.nearby .roominfo .distrat .location-cuddles::after { content:none; display:none; }
.nearby .roominfo .distrat .location-cuddles:hover,
.nearby .roominfo .distrat .distance a:hover > .material-icons { transform:none; filter:brightness(1.12); }

/* The discovery screen needs a sense of place even between cards: one slow
   night-map mesh and one quiet signal trail travel behind the interface. */
.nearby md-content.greybg {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:
    radial-gradient(ellipse at 12% 28%,rgba(103,91,202,.18),transparent 30%),
    radial-gradient(ellipse at 88% 72%,rgba(51,152,219,.14),transparent 34%),
    linear-gradient(160deg,#131623 0%,#191b2c 52%,#11131d 100%);
}
.nearby md-content.greybg::before {
  content:'';
  position:absolute;
  z-index:0;
  inset:56px -25% -15%;
  pointer-events:none;
  background:
    radial-gradient(circle,rgba(203,195,255,.17) 1px,transparent 1.3px) 0 0 / 20px 20px,
    radial-gradient(ellipse at 21% 32%,rgba(144,111,241,.18),transparent 24%),
    radial-gradient(ellipse at 78% 64%,rgba(65,178,238,.14),transparent 29%);
  opacity:.72;
  animation:lup-discovery-mesh 19s ease-in-out infinite alternate;
}
.nearby md-content.greybg::after {
  content:'';
  position:absolute;
  z-index:0;
  top:45%;
  left:-55%;
  width:76%;
  height:2px;
  pointer-events:none;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,rgba(125,196,255,.06) 8%,rgba(181,152,255,.76) 47%,rgba(111,211,255,.10) 78%,transparent);
  box-shadow:0 0 8px rgba(160,139,255,.22),0 0 22px rgba(69,177,239,.13);
  transform:rotate(-13deg);
  animation:lup-discovery-signal-trail 15s cubic-bezier(.38,.05,.56,.95) infinite;
}

/* Room navigation: one precise control strip for place, conversation and
   people. The active area receives the light; the other two stay quiet. */
.location-page md-tabs md-tabs-wrapper {
  position:relative;
  margin:0;
  border:0;
  border-top:1px solid rgba(188,215,247,.10);
  border-bottom:1px solid rgba(188,215,247,.11);
  border-radius:0;
  background:linear-gradient(100deg,rgba(18,24,42,.97),rgba(27,33,56,.97));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 8px 20px rgba(2,7,20,.13);
}
.location-page md-tabs md-tabs-canvas,
.location-page md-tabs md-pagination-wrapper { height:54px; }
.location-page md-tabs md-tab-item {
  min-width:0;
  height:54px;
  min-height:54px;
  margin:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:#8e9bb0;
  transition:background 180ms ease,color 180ms ease;
}
.location-page md-tabs md-tab-item + md-tab-item { border-left:1px solid rgba(190,215,244,.075); }
.location-page md-tabs md-tab-item .md-tab-label {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  font-size:10px;
  font-weight:820;
  letter-spacing:.075em;
}
.location-page md-tabs md-tab-item .md-tab-label::before {
  width:25px;
  height:25px;
  border:0;
  border-radius:8px 8px 8px 3px;
  background:rgba(174,205,241,.055);
  color:#9bb3cf;
  transition:background 180ms ease,color 180ms ease,transform 180ms ease;
}
.location-page md-tabs md-tab-item.md-active {
  background:linear-gradient(100deg,rgba(110,125,210,.18),rgba(94,177,230,.09));
  box-shadow:inset 0 1px 0 rgba(226,240,255,.10);
  color:#f2f8ff;
}
.location-page md-tabs md-tab-item.md-active .md-tab-label::before {
  background:linear-gradient(145deg,rgba(151,192,255,.28),rgba(113,161,222,.15));
  color:#e3f5ff;
  transform:translateY(-1px);
}
.location-page md-tabs md-tab-item.md-active::after {
  right:22%;
  bottom:0;
  left:22%;
  height:2px;
  border-radius:2px 2px 0 0;
  background:linear-gradient(90deg,transparent,#c8eaff 48%,transparent);
  box-shadow:0 0 12px rgba(133,205,255,.62);
}
.location-page md-tabs md-tab-item[disabled] { opacity:.36; }
@media (max-width:360px) {
  .location-page md-tabs md-tabs-canvas,.location-page md-tabs md-pagination-wrapper { height:50px; }
  .location-page md-tabs md-tab-item { height:50px; min-height:50px; }
  .location-page md-tabs md-tab-item .md-tab-label { gap:4px; font-size:9px; letter-spacing:.045em; }
  .location-page md-tabs md-tab-item .md-tab-label::before { width:22px; height:22px; font-size:15px; }
}
.nearby md-content.greybg > * { position:relative; z-index:1; }
@keyframes lup-discovery-mesh {
  0% { transform:translate3d(-3%,-2%,0) scale(1); opacity:.46; }
  55% { transform:translate3d(3%,2%,0) scale(1.05); opacity:.78; }
  100% { transform:translate3d(1%,-3%,0) scale(1.02); opacity:.54; }
}
@keyframes lup-discovery-signal-trail {
  0% { transform:translate3d(0,48px,0) rotate(-13deg); opacity:0; }
  13% { opacity:.82; }
  72% { opacity:.55; }
  100% { transform:translate3d(255vw,-64px,0) rotate(-13deg); opacity:0; }
}
@media (prefers-reduced-motion:reduce) {
  .nearby md-content.greybg::before,.nearby md-content.greybg::after { animation:none; }
}
@keyframes lup-card-signal-arc {
  0% { transform:translate3d(-2%,8px,0) scale(.96); opacity:.36; }
  52% { transform:translate3d(2%,-5px,0) scale(1.035); opacity:.88; }
  100% { transform:translate3d(-1%,-1px,0) scale(1); opacity:.52; }
}

/* Location navigation and presence: calm premium surfaces, clear current
   state, and people as the focus rather than decorative chrome. */
.location-page md-tabs md-tabs-wrapper {
  margin:0;
  border-bottom:1px solid rgba(255,255,255,.08);
  background:linear-gradient(100deg,#171a29,#20223a);
  box-shadow:inset 0 -1px 0 rgba(0,0,0,.22);
}
.location-page md-tabs md-tabs-canvas,
.location-page md-tabs md-pagination-wrapper { height:52px; }
.location-page md-tabs md-tab-item {
  position:relative;
  height:52px;
  min-height:52px;
  color:#9d9aaf;
  letter-spacing:.055em;
}
.location-page md-tabs md-tab-item .md-tab-label { font-size:10px; font-weight:760; }
.location-page md-tabs md-tab-item .md-tab-label::before { width:26px; height:26px; border-radius:9px; background:rgba(255,255,255,.035); color:#a8a5b7; }
.location-page md-tabs md-tab-item.md-active { background:rgba(255,255,255,.045); box-shadow:inset 0 1px 0 rgba(255,255,255,.10); color:#f7f5fd; }
.location-page md-tabs md-tab-item.md-active::after { content:''; position:absolute; right:17%; bottom:0; left:17%; height:2px; border-radius:2px 2px 0 0; background:linear-gradient(90deg,transparent,#b8a6ff,#88cfff,transparent); box-shadow:0 0 12px rgba(156,135,255,.45); }
.location-page md-tabs md-tab-item.md-active .md-tab-label::before { background:rgba(165,143,243,.18); color:#eeeaff; }

.location-page md-list.usernavigation {
  padding:16px 14px 28px;
  background:radial-gradient(ellipse at 82% 2%,rgba(125,107,228,.16),transparent 29%),linear-gradient(160deg,#151825,#10121b);
}
.location-page md-list.usernavigation .location-presence-heading {
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  align-items:center;
  gap:11px;
  min-height:76px;
  margin:0 0 13px;
  padding:13px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(83,77,127,.42),rgba(29,33,50,.80));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 13px 27px rgba(0,0,0,.16);
}
.location-page md-list.usernavigation .location-presence-heading::after { display:none; }
.location-page md-list.usernavigation .presence-live-mark { position:relative; display:grid; place-items:center; width:40px; height:40px; border:1px solid rgba(135,228,179,.32); border-radius:13px; background:rgba(73,186,133,.12); color:#9be4ba; }.location-page md-list.usernavigation .presence-live-mark .material-icons { font-size:22px; }.location-page md-list.usernavigation .presence-live-mark b { position:absolute; top:7px; right:7px; width:6px; height:6px; border-radius:50%; background:#78dfa4; box-shadow:0 0 0 3px rgba(120,223,164,.13),0 0 10px rgba(120,223,164,.66); }
.location-page md-list.usernavigation .location-presence-heading strong { overflow:hidden; color:#f5f3fb; font-size:14px; font-weight:720; letter-spacing:-.01em; text-overflow:ellipsis; white-space:nowrap; }.location-page md-list.usernavigation .location-presence-heading span:not(.presence-live-mark):not(.presence-total) { margin-top:3px; color:#aaa6b7; font-size:10px; }
.location-page md-list.usernavigation .presence-total { display:grid; justify-items:end; gap:1px; min-width:35px; }.location-page md-list.usernavigation .presence-total b { color:#fff; font-size:19px; font-weight:720; line-height:1; }.location-page md-list.usernavigation .presence-total small { color:#8fe1b1; font-size:7px; font-weight:850; letter-spacing:.09em; }
.location-page md-list.usernavigation .visitors-list { display:grid; gap:8px; padding:0; }
.location-page md-list.usernavigation .presence-person {
  min-height:66px;
  margin:0;
  padding:9px 10px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.075);
  border-radius:14px;
  background:rgba(255,255,255,.03);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055);
}
.location-page md-list.usernavigation .presence-person::before { top:11px; bottom:11px; width:2px; background:linear-gradient(#8fe0b1,#79a9e4); opacity:.82; }.location-page md-list.usernavigation .presence-person .presence-avatar { width:42px; height:42px; margin-right:10px; outline:1px solid rgba(164,222,191,.38); outline-offset:2px; }.location-page md-list.usernavigation .presence-person .presence-avatar img { width:42px; height:42px; }.location-page md-list.usernavigation .presence-person-copy .username { margin:0 0 3px; color:#f6f4fb; font-size:13px; font-weight:720; }.location-page md-list.usernavigation .presence-person-copy p:last-child { display:flex; align-items:center; gap:4px; margin:0; color:#aaa7b8; font-size:10px; }.location-page md-list.usernavigation .presence-person-copy p:last-child .material-icons { color:#79dda7; font-size:9px; }
.location-page md-list.usernavigation .presence-actions { gap:5px; margin-left:8px; }.location-page md-list.usernavigation .presence-actions .presence-action { width:32px; height:32px; min-width:32px; padding:0; border:1px solid rgba(255,255,255,.11); border-radius:10px; background:rgba(255,255,255,.05); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); color:#d9d4ea; transition:transform .16s ease,filter .16s ease,border-color .16s ease; }.location-page md-list.usernavigation .presence-actions .presence-action .material-icons { font-size:17px; }.location-page md-list.usernavigation .presence-actions .presence-action:hover,.location-page md-list.usernavigation .presence-actions .presence-action:focus-visible { transform:translateY(-1px); filter:brightness(1.11); }.location-page md-list.usernavigation .presence-actions .presence-message { border-color:rgba(181,160,255,.28); background:linear-gradient(145deg,rgba(143,113,229,.24),rgba(87,112,195,.14)); color:#ded4ff; }.location-page md-list.usernavigation .presence-actions .presence-friend { border-color:rgba(117,222,189,.26); background:linear-gradient(145deg,rgba(72,177,144,.21),rgba(69,112,164,.13)); color:#b7f0d8; }.location-page md-list.usernavigation .presence-actions .presence-pending { border-color:rgba(246,196,112,.34); background:rgba(181,126,55,.16); color:#ffe0a6; }.location-page md-list.usernavigation .presence-actions .presence-connected { border-color:rgba(133,206,255,.30); background:rgba(72,137,191,.18); color:#c3eaff; }.location-page md-list.usernavigation .presence-actions .presence-up { color:#ffdd83; }
@media (max-width:360px) { .location-page md-list.usernavigation { padding-right:10px; padding-left:10px; }.location-page md-list.usernavigation .location-presence-heading { grid-template-columns:38px minmax(0,1fr) auto; gap:9px; padding:11px; }.location-page md-list.usernavigation .presence-live-mark { width:36px; height:36px; }.location-page md-list.usernavigation .presence-actions { gap:3px; margin-left:4px; }.location-page md-list.usernavigation .presence-actions .presence-action { width:29px; height:29px; min-width:29px; } }

/* Keep the review list inside the dark location surface. Material's default
   subheader otherwise flashes a white strip on the comments route. */
.location-reviews-page md-subheader,
.location-reviews-page md-subheader .md-subheader-inner,
.location-reviews-page .reviews-list-heading {
  background:transparent;
  color:#c9c4d8;
}
.location-reviews-page md-subheader {
  min-height:36px;
  margin:0;
  padding:8px 1px 4px;
  border:0;
}
.location-reviews-page .reviews-list-heading { min-height:24px; }
.location-reviews-page .reviews-list-heading--plain {
  min-height:38px;
  margin:0;
  padding:8px 3px 5px;
  box-sizing:border-box;
  background:transparent;
}
.location-reviews-page .lup-comment-text,
.location-reviews-page .lup-comment-text *,
.location-reviews-page .md-list-item-text h4,
.location-reviews-page .md-list-item-text h4 * {
  color:#f3f1fa;
  -webkit-text-fill-color:#f3f1fa;
}

/* Angular Material can inject a wrapper with its light default background.
   Give every layer of this one heading the review page's own dark surface. */
.location-reviews-page .reviews-list > .md-subheader-wrapper,
.location-reviews-page .reviews-list > .md-subheader-wrapper > md-subheader,
.location-reviews-page .reviews-list > .md-subheader-wrapper .md-subheader-inner,
.location-reviews-page .reviews-list > .md-subheader-wrapper .md-subheader-content,
.location-reviews-page .reviews-list > md-subheader,
.location-reviews-page .reviews-list > md-subheader .md-subheader-inner,
.location-reviews-page .reviews-list > md-subheader .md-subheader-content {
  background:#10121d;
  background-image:none;
  box-shadow:none;
}

/* Conversation: no borrowed paper-plane look. The composer is a calm writing
   dock, while the action is an unmistakable LinkUUp conversation mark. */
.location-chat-surface {
  background:
    radial-gradient(ellipse at 8% 105%,color-mix(in srgb,var(--chat-accent) 17%,transparent),transparent 42%),
    radial-gradient(ellipse at 92% 5%,var(--chat-glow),transparent 36%),
    linear-gradient(155deg,#171a2a,#0e101a 76%);
}
.location-chat-surface .chat-msgs {
  padding:16px 13px;
  background:linear-gradient(180deg,rgba(17,19,30,.12),rgba(9,11,19,.64));
}
.location-chat-surface .lup-msg { margin-bottom:10px; }
.location-chat-surface .lup-msg .msg {
  margin:0;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:15px 15px 15px 6px;
  background:rgba(255,255,255,.045);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055);
}
.location-chat-surface .lup-own-msg .msg {
  border-color:color-mix(in srgb,var(--chat-accent) 31%,rgba(255,255,255,.10));
  border-radius:15px 15px 6px 15px;
  background:color-mix(in srgb,var(--chat-accent) 13%,rgba(255,255,255,.04));
}
.location-chat-surface .chatbottom {
  display:flex;
  align-items:center;
  gap:9px;
  pointer-events:auto;
  height:72px;
  padding:11px 13px;
  border:0;
  border-top:1px solid color-mix(in srgb,var(--chat-accent) 18%,rgba(255,255,255,.08));
  background:linear-gradient(180deg,rgba(12,14,24,.74),rgba(17,19,31,.96));
}
.location-chat-surface .chatbottom .chat-input {
  float:none;
  flex:1 1 auto;
  width:auto;
  padding:0;
}
.location-chat-surface .chatbottom input {
  position:relative;
  z-index:2;
  pointer-events:auto;
  width:100%;
  height:46px;
  padding:0 14px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  outline:none;
  background:rgba(255,255,255,.055);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055);
  color:#f5f3fb;
}
.location-chat-surface .chatbottom input:focus {
  border-color:color-mix(in srgb,var(--chat-accent) 52%,rgba(255,255,255,.17));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 0 0 2px color-mix(in srgb,var(--chat-accent) 13%,transparent);
}
.location-chat-surface .chatbottom .chat-compose-send {
  position:relative;
  z-index:2;
  float:none;
  display:grid;
  place-items:center;
  flex:0 0 46px;
  width:46px;
  height:46px;
  margin:0;
  padding:0;
  border:1px solid color-mix(in srgb,var(--chat-accent) 38%,rgba(255,255,255,.15));
  border-radius:15px;
  background:color-mix(in srgb,var(--chat-accent) 18%,rgba(255,255,255,.04));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 7px 17px rgba(0,0,0,.16);
}
.location-chat-surface .chatbottom .chat-compose-send button,
.location-chat-surface .chatbottom .chat-compose-send button.sendmessage {
  display:grid;
  place-items:center;
  width:100%;
  max-width:none;
  height:100%;
  min-width:0;
  padding:0;
  border:0;
  border-radius:inherit;
  background:transparent;
  -webkit-mask:none;
  mask:none;
  color:color-mix(in srgb,var(--chat-accent) 72%,#fff);
  cursor:pointer;
}
.location-chat-surface .chatbottom .chat-compose-send button.sendmessage { color:#fff; }
.location-chat-surface .chatbottom .chat-compose-send .material-icons { font-size:21px; }

/* A busy room needs a compact composer: one quiet dock, not a box inside a
   second box. */
.location-chat-surface .chatbottom {
  height:54px;
  gap:7px;
  padding:8px 12px;
  background:rgba(14,16,26,.94);
}
.location-chat-surface .chatbottom input {
  height:36px;
  padding:0 9px;
  border:0;
  border-bottom:1px solid rgba(255,255,255,.14);
  border-radius:0;
  background:transparent;
  box-shadow:none;
  font-size:12px;
}
.location-chat-surface .chatbottom input:focus {
  border-bottom-color:color-mix(in srgb,var(--chat-accent) 65%,#fff);
  box-shadow:none;
}
.location-chat-surface .chatbottom .chat-compose-send {
  flex-basis:36px;
  width:36px;
  height:36px;
  border-radius:11px;
  box-shadow:none;
}
.location-chat-surface .chatbottom .chat-compose-send .material-icons { font-size:18px; }

/* Message identity is metadata, not a second card. Only the actual text gets
   a speech bubble, which keeps dense conversations airy and readable. */
.location-chat-surface .lup-msg .msg,
.location-chat-surface .lup-own-msg .msg {
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.location-chat-surface .chat-msgs .msg .name,
.location-chat-surface .chat-msgs .msg .time {
  display:inline-block;
  float:none;
  width:auto;
  padding:0 0 4px;
  font-size:9px;
  line-height:1;
}
.location-chat-surface .chat-msgs .msg .name { margin-right:7px; }
.location-chat-surface .chat-msgs .msg .message {
  display:block;
  width:auto;
  padding:9px 11px;
  border-radius:14px 14px 14px 5px;
  background:rgba(255,255,255,.055);
  box-shadow:none;
}
.location-chat-surface .lup-own-msg .message {
  border-radius:14px 14px 5px 14px;
}

/* Let every bubble grow naturally with its message. The text and avatar are
   laid out together instead of relying on old floats with fixed widths. */
.location-chat-surface .chat-msgs .msg .message {
  display:flex;
  align-items:flex-end;
  gap:7px;
  min-width:0;
  overflow-wrap:anywhere;
}
.location-chat-surface .chat-msgs .msg .messager-inner,
.location-chat-surface .lup-own-msg .message .messager-inner,
.location-chat-surface .lup-other-msg .message .messager-inner {
  display:block;
  float:none;
  flex:1 1 auto;
  min-width:0;
  max-width:none;
  padding:0;
  text-align:left;
  white-space:normal;
  word-break:break-word;
}
.location-chat-surface .chat-msgs .msg .message .lup-avatar {
  float:none;
  flex:0 0 30px;
  width:30px;
  height:30px;
  margin:0;
}
.location-chat-surface .lup-own-msg .msg .name,
.location-chat-surface .lup-own-msg .msg .time { text-align:right; }

/* The live counter must stay crisp in a crowded room: solid surfaces, sharp
   type and a dedicated number chip from 0 through 99+. */
.nearby .room-user-preview,
.nearby .room-user-preview .lup-avatar,
.nearby .room-user-preview .more-users,
.nearby .room-presence-count {
  filter:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  opacity:1;
}
.nearby .room-presence-count {
  display:inline-flex;
  align-items:center;
  gap:5px;
  min-height:32px;
  margin-top:7px;
  padding:4px 8px 4px 5px;
  border:1px solid rgba(132,224,178,.30);
  border-radius:10px;
  background:#1b2831;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 4px 12px rgba(0,0,0,.14);
  color:#dcefe5;
  font-size:9px;
  font-weight:720;
  letter-spacing:.01em;
}
.nearby .room-presence-count .material-icons { color:#7cdda5; font-size:16px; }
.nearby .room-presence-count b {
  display:grid;
  place-items:center;
  min-width:21px;
  height:21px;
  padding:0 3px;
  border-radius:7px;
  background:#315a4a;
  color:#fff;
  font-size:10px;
  font-weight:850;
  line-height:1;
  font-variant-numeric:tabular-nums;
}
.nearby .room-presence-count.has-visitors b { background:#4a9b70; box-shadow:0 0 12px rgba(101,221,161,.25); }
.nearby .room-presence-count span { white-space:nowrap; }

/* Angular Material wraps subheader content in its own element. Keep that
   wrapper as one resilient row on every viewport; never grid its text. */
.location-page md-list.usernavigation .location-presence-heading { display:block; min-height:0; padding:0; background:transparent; border:0; box-shadow:none; overflow:visible; }
.location-page md-list.usernavigation .location-presence-heading .md-subheader-inner { display:flex; align-items:center; gap:10px; min-height:62px; padding:11px 12px; box-sizing:border-box; overflow:hidden; border:1px solid rgba(255,255,255,.10); border-radius:15px; background:linear-gradient(135deg,rgba(83,77,127,.42),rgba(29,33,50,.80)); box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 13px 27px rgba(0,0,0,.16); }
.location-page md-list.usernavigation .location-presence-heading .presence-live-mark { position:relative; display:grid; place-items:center; flex:0 0 38px; width:38px; height:38px; border:1px solid rgba(135,228,179,.32); border-radius:12px; background:rgba(73,186,133,.12); color:#9be4ba; box-shadow:0 0 16px rgba(91,218,160,.12); }.location-page md-list.usernavigation .location-presence-heading .presence-live-mark .material-icons { font-size:21px; }.location-page md-list.usernavigation .location-presence-heading .presence-live-mark b { position:absolute; top:7px; right:7px; width:6px; height:6px; border-radius:50%; background:#78dfa4; box-shadow:0 0 0 3px rgba(120,223,164,.13),0 0 10px rgba(120,223,164,.66); }
.location-page md-list.usernavigation .location-presence-heading .presence-total { display:grid; justify-items:end; gap:1px; flex:0 0 auto; min-width:35px; margin:0; color:inherit; }.location-page md-list.usernavigation .location-presence-heading .presence-total b { color:#fff; font-size:19px; font-weight:720; line-height:1; }.location-page md-list.usernavigation .location-presence-heading .presence-total small { color:#8fe1b1; font-size:7px; font-weight:850; letter-spacing:.09em; }
.location-page md-list.usernavigation .location-presence-heading .md-subheader-inner > .material-icons { display:grid; place-items:center; flex:0 0 38px; width:38px; height:38px; margin:0; border:1px solid rgba(135,228,179,.32); border-radius:12px; background:rgba(73,186,133,.12); color:#9be4ba; font-size:21px; }
.location-page md-list.usernavigation .location-presence-heading .md-subheader-inner > div { min-width:0; flex:1 1 auto; }.location-page md-list.usernavigation .location-presence-heading .md-subheader-inner strong { display:block; overflow:hidden; color:#f5f3fb; font-size:13px; font-weight:720; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }.location-page md-list.usernavigation .location-presence-heading .md-subheader-inner span { display:block; overflow:hidden; margin-top:3px; color:#aaa6b7; font-size:10px; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }

.vote-dialog-note { margin:0 0 13px; padding:9px 10px; border-left:2px solid #9bcfff; background:rgba(104,149,219,.10); color:#c7d8ed; font-size:11px; line-height:1.4; }

/* Final presence header: one live signal, one total, no decorative duplicates.
   It is deliberately a quiet full-width control so it remains stable from
   narrow phones through desktop. */
.location-page md-list.usernavigation .location-presence-heading .md-subheader-inner { position:relative; flex-wrap:nowrap; min-height:56px; padding:0 49px 10px 3px; overflow:visible; border:0; border-bottom:1px solid rgba(181,204,255,.15); border-radius:0; background:transparent; box-shadow:none; }
.location-page md-list.usernavigation .location-presence-heading .presence-live-mark { position:relative; display:grid; place-items:center; flex:0 0 30px; width:30px; height:30px; margin-top:-2px; border:1px solid rgba(159,193,255,.18); border-radius:50%; background:rgba(104,138,207,.09); box-shadow:inset 0 1px 0 rgba(255,255,255,.07); color:#a9dfff; }.location-page md-list.usernavigation .presence-live-mark .material-icons { font-size:19px; animation:lup-presence-pin 2.7s ease-in-out infinite; filter:drop-shadow(0 3px 5px rgba(70,169,235,.30)); }.location-page md-list.usernavigation .location-presence-heading .presence-live-mark b,.location-page md-list.usernavigation .location-presence-heading .presence-live-mark::after { display:none; content:none; }
@keyframes lup-presence-pin { 0%,100% { transform:translateY(1px); opacity:.82; } 50% { transform:translateY(-2px); opacity:1; } }

/* Center the live pin by its actual glyph box and keep the familiar LinkUUp
   blue rather than adding a second accent colour. */
.location-page md-list.usernavigation .location-presence-heading .presence-live-mark { box-sizing:border-box; justify-content:center; align-content:center; border-color:rgba(141,201,255,.38); background:radial-gradient(circle at 34% 27%,rgba(214,244,255,.22),transparent 33%),linear-gradient(145deg,rgba(90,155,226,.28),rgba(68,87,172,.15)); box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 0 13px rgba(81,172,243,.13); color:#b9e5ff; }.location-page md-list.usernavigation .presence-live-mark .material-icons { display:block; width:19px; height:19px; margin:0; padding:0; line-height:19px; text-align:center; transform-origin:50% 50%; }
.location-page md-list.usernavigation .location-presence-heading .presence-live-mark { position:absolute; top:9px; right:43px; left:auto; z-index:2; }

/* Structural safety net for the live header: pin | copy | total. */
.location-page md-list.usernavigation .location-presence-heading .md-subheader-inner { display:flex; align-items:center; flex-wrap:nowrap; gap:9px; padding-right:49px; }.location-page md-list.usernavigation .location-presence-heading .presence-live-mark { position:relative; top:auto; right:auto; left:auto; flex:0 0 30px; margin:0; }.location-page md-list.usernavigation .location-presence-heading .md-subheader-inner > div { flex:1 1 auto; min-width:0; padding-left:0; }.location-page md-list.usernavigation .location-presence-heading .md-subheader-inner > div > strong,.location-page md-list.usernavigation .location-presence-heading .md-subheader-inner > div > span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.location-page md-list.usernavigation .location-presence-heading .presence-live-mark { border-color:rgba(123,203,255,.58); background:radial-gradient(circle at 34% 27%,rgba(226,248,255,.31),transparent 33%),linear-gradient(145deg,rgba(71,164,232,.42),rgba(57,82,176,.22)); box-shadow:inset 0 1px 0 rgba(255,255,255,.20),0 0 19px rgba(74,183,255,.27); color:#d3f0ff; }.location-page md-list.usernavigation .md-subheader-inner > div > span { margin-top:0; color:#c1cce0; font-size:10px; }
@media (prefers-reduced-motion:reduce) { .location-page md-list.usernavigation .presence-live-mark .material-icons { animation:none; } }

/* Do not let Angular Material wrap the conversation control as a secondary
   item. It remains a normal flex child and therefore reaches the true edge. */
.notification .notification-panel .inbox-message-list .inbox-thread-card .md-list-item-inner { display:flex; align-items:center; width:100%; padding:0; }
.notification .notification-panel .inbox-message-list .inbox-thread-open { position:static; display:grid; flex:0 0 34px; align-self:center; width:34px; height:34px; min-width:34px; margin:0 0 0 auto; }
.location-page md-list.usernavigation .location-presence-heading .presence-total { position:absolute; top:8px; right:3px; display:grid; justify-items:end; gap:0; min-width:34px; margin:0; }.location-page md-list.usernavigation .location-presence-heading .presence-total strong { color:#eef5ff; font-size:18px; font-weight:760; line-height:1; }.location-page md-list.usernavigation .location-presence-heading .presence-total b { display:none; }.location-page md-list.usernavigation .location-presence-heading .presence-total small { margin-top:3px; color:#91cdb0; font-size:7px; font-weight:850; letter-spacing:.09em; }
.location-page md-list.usernavigation .location-presence-heading .md-subheader-inner > div { padding-left:1px; }.location-page md-list.usernavigation .location-presence-heading .md-subheader-inner strong { font-size:13px; }.location-page md-list.usernavigation .location-presence-heading .md-subheader-inner > div > span { margin-top:2px; font-size:9px; }

/* Online is a live lounge: a stable header stays visible while a busy venue
   * receives its own smooth, contained visitor stream. */
.location-page md-list.usernavigation {
  padding:14px 14px 18px;
  background:
    radial-gradient(ellipse at 88% 6%,rgba(116,130,231,.18),transparent 31%),
    radial-gradient(circle at 7% 21%,rgba(101,220,170,.08),transparent 24%),
    linear-gradient(160deg,#171b2a,#10131c 78%);
}
.location-page md-list.usernavigation .location-presence-heading {
  margin:0 0 11px;
}
.location-page md-list.usernavigation .location-presence-heading .md-subheader-inner {
  min-height:58px;
  padding:0 8px 8px 2px;
  border-bottom-color:rgba(164,201,255,.20);
}
.location-page md-list.usernavigation .location-presence-heading .presence-live-mark {
  flex-basis:34px;
  width:34px;
  height:34px;
  border-radius:12px 12px 12px 5px;
}
.location-page md-list.usernavigation .location-presence-heading .presence-live-mark .material-icons {
  width:20px;
  height:20px;
  line-height:20px;
  font-size:20px;
}
.location-page md-list.usernavigation .location-presence-heading .presence-total {
  position:relative;
  top:auto;
  right:auto;
  flex:0 0 43px;
  min-width:43px;
  min-height:37px;
  padding:4px 6px;
  border:1px solid rgba(143,218,180,.22);
  border-radius:11px;
  background:rgba(80,180,137,.09);
}
.location-page md-list.usernavigation .location-presence-heading .presence-total strong { font-size:18px; }
.location-page md-list.usernavigation .visitors-list {
  max-height:calc(100dvh - 190px);
  padding:1px 2px 12px;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:rgba(151,194,255,.46) transparent;
}
.location-page md-list.usernavigation .presence-person {
  min-height:72px;
  margin:8px 0;
  padding:10px 11px;
  border-radius:15px;
  background:linear-gradient(105deg,rgba(87,104,158,.24),rgba(24,29,45,.78) 70%);
}
.location-page md-list.usernavigation .presence-person:first-child { margin-top:0; }
.location-page md-list.usernavigation .presence-person .presence-avatar,
.location-page md-list.usernavigation .presence-person .presence-avatar img { width:44px; height:44px; }
@media (max-width:390px) {
  .location-page md-list.usernavigation { padding:12px 11px 16px; }
  .location-page md-list.usernavigation .presence-person { min-height:68px; padding:9px 8px; }
  .location-page md-list.usernavigation .presence-person .presence-avatar,
  .location-page md-list.usernavigation .presence-person .presence-avatar img { width:40px; height:40px; }
}

/* Final entry treatment: only a chat that is available looks like an open
   door. This rule deliberately sits last because older discovery passes use
   the same selector. */
.nearby .chatbutton:not(.chatbutton--locked) { width:min(88%,342px); margin:14px auto 0; }
.nearby .chatbutton:not(.chatbutton--locked) button { min-height:54px; height:54px; border-color:color-mix(in srgb,var(--lup-place-accent) 54%,rgba(235,241,255,.55)); border-radius:17px; background:linear-gradient(108deg,color-mix(in srgb,var(--lup-place-accent) 78%,#8d71e8),color-mix(in srgb,var(--lup-place-accent) 48%,#2d72bf)); box-shadow:0 0 0 1px rgba(255,255,255,.12),0 12px 26px color-mix(in srgb,var(--lup-place-glow) 66%,transparent),0 14px 24px rgba(9,14,39,.30),inset 0 1px 0 rgba(255,255,255,.40),inset 0 -1px 0 rgba(20,28,75,.24); color:#fff; font-size:13px; font-weight:900; letter-spacing:.04em; text-shadow:0 1px 3px rgba(16,23,71,.36); }
.nearby .chatbutton:not(.chatbutton--locked) button::before { content:'login'; display:inline-grid; place-items:center; width:29px; height:29px; margin:0 2px 0 0; border:1px solid rgba(255,255,255,.34); border-radius:10px 10px 10px 4px; background:rgba(12,24,78,.19); box-shadow:inset 0 1px 0 rgba(255,255,255,.20),0 0 13px rgba(255,255,255,.15); color:#fff; font-family:'Material Icons'; font-size:19px; line-height:1; }
.nearby .chatbutton:not(.chatbutton--locked) button::after { content:''; position:absolute; top:50%; right:12px; bottom:auto; left:auto; width:7px; height:7px; border:1px solid rgba(255,255,255,.68); border-radius:50%; background:#aaf5d1; box-shadow:0 0 0 4px rgba(170,245,209,.12),0 0 13px rgba(170,245,209,.86); transform:translateY(-50%); }
.nearby .chatbutton:not(.chatbutton--locked) button:hover { filter:brightness(1.08) saturate(1.08); transform:translateY(-1px); }
.nearby .chatbutton:not(.chatbutton--locked) button:active { transform:translateY(1px); }

/* Presence cards: people first, actions second. Labels appear where there is
   room and collapse to the same unambiguous symbols on a phone. */
.location-page md-list.usernavigation .presence-person { position:relative; border-color:rgba(184,208,255,.13); border-radius:17px; background:linear-gradient(118deg,rgba(69,84,131,.22),rgba(25,29,46,.72) 65%); box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 8px 18px rgba(0,0,0,.11); }.location-page md-list.usernavigation .presence-person::before { top:13px; bottom:13px; background:linear-gradient(#8fe0b1,#85b9f3); }.location-page md-list.usernavigation .presence-person .presence-avatar { width:46px; height:46px; margin-right:12px; outline:1px solid rgba(172,226,203,.48); outline-offset:3px; }.location-page md-list.usernavigation .presence-person .presence-avatar img { width:46px; height:46px; }.location-page md-list.usernavigation .presence-person-copy p:last-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.location-page md-list.usernavigation .presence-person-copy p:last-child .material-icons { flex:0 0 auto; color:#84dfae; font-size:12px; }.location-page md-list.usernavigation .presence-actions { padding:3px; border:1px solid rgba(255,255,255,.075); border-radius:13px; background:rgba(8,12,24,.28); }.location-page md-list.usernavigation .presence-actions .presence-action { display:inline-flex; align-items:center; justify-content:center; gap:5px; overflow:hidden; }.location-page md-list.usernavigation .presence-actions .presence-action span { display:none; font-size:9px; font-weight:800; letter-spacing:.01em; }.location-page md-list.usernavigation .presence-actions .presence-action:active { transform:scale(.94); }
@media (min-width:560px) { .location-page md-list.usernavigation .presence-actions .presence-action { width:auto; min-width:34px; padding:0 8px; }.location-page md-list.usernavigation .presence-actions .presence-action span { display:inline; }.location-page md-list.usernavigation .presence-person { min-height:74px; } }

/* Live-room final cascade: this stays physically last because the legacy
   stylesheet contains older online-card experiments above it. */
.location-page md-list.usernavigation { position:relative; isolation:isolate; padding:18px 16px 20px; overflow:hidden; background:radial-gradient(ellipse 72% 34% at 15% 0%,rgba(71,151,223,.16),transparent 70%),radial-gradient(ellipse 48% 32% at 92% 29%,rgba(123,83,207,.15),transparent 76%),linear-gradient(155deg,#121b2d 0%,#0c1220 75%); }
.location-page md-list.usernavigation::before { content:''; position:absolute; z-index:-1; top:-35px; right:-48px; width:220px; height:220px; border:1px solid rgba(162,217,255,.10); border-radius:50%; box-shadow:0 0 0 38px rgba(162,217,255,.018),0 0 0 86px rgba(162,217,255,.012); }
.location-page md-list.usernavigation .location-presence-heading { margin:0 0 13px; }.location-page md-list.usernavigation .location-presence-heading .md-subheader-inner { min-height:59px; padding:0 3px 12px; gap:10px; border:0; border-bottom:1px solid rgba(183,216,248,.16); border-radius:0; background:transparent; box-shadow:none; }
.location-page md-list.usernavigation .location-presence-heading .presence-live-mark { flex:0 0 37px; width:37px; height:37px; border:1px solid rgba(127,212,255,.45); border-radius:13px 13px 13px 5px; background:linear-gradient(145deg,rgba(70,163,225,.32),rgba(83,79,181,.20)); box-shadow:inset 0 1px 0 rgba(255,255,255,.17),0 0 18px rgba(77,177,248,.18); color:#d4f1ff; }.location-page md-list.usernavigation .presence-live-mark .material-icons { animation:lup-presence-pin 3s ease-in-out infinite; }
.location-page md-list.usernavigation .location-presence-heading .presence-header-copy strong { color:#f2f7ff; font-size:14px; font-weight:760; letter-spacing:-.015em; }.location-page md-list.usernavigation .location-presence-heading .presence-header-copy span { margin-top:3px; color:#9daec4; font-size:10px; }
.location-page md-list.usernavigation .location-presence-heading .presence-total { position:relative; top:auto; right:auto; flex:0 0 46px; min-width:46px; min-height:39px; padding:4px 5px; border:1px solid rgba(130,223,178,.26); border-radius:12px; background:rgba(76,179,137,.09); }.location-page md-list.usernavigation .presence-total strong { color:#f5fffa; font-size:19px; font-weight:800; }.location-page md-list.usernavigation .presence-total small { color:#8ce5b5; font-size:7px; }
.location-page md-list.usernavigation .visitors-list { display:block; max-height:calc(100dvh - 214px); padding:1px 1px 12px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:rgba(141,197,255,.40) transparent; }
.location-page md-list.usernavigation .presence-empty { display:grid; justify-items:center; gap:6px; padding:34px 19px; border:1px dashed rgba(160,202,241,.18); border-radius:17px; background:rgba(10,16,30,.23); color:#a7b8cc; text-align:center; }.location-page md-list.usernavigation .presence-empty .material-icons { color:#9edcff; font-size:25px; opacity:.84; }.location-page md-list.usernavigation .presence-empty strong { color:#e7f2ff; font-size:13px; }.location-page md-list.usernavigation .presence-empty span { font-size:11px; line-height:1.45; }
.location-page md-list.usernavigation .presence-person { min-height:72px; margin:8px 0; padding:11px 10px 11px 12px; border:1px solid rgba(184,208,255,.11); border-radius:16px; background:linear-gradient(112deg,rgba(65,85,137,.20),rgba(22,28,45,.64) 67%); box-shadow:inset 0 1px 0 rgba(255,255,255,.065),0 9px 20px rgba(0,0,0,.10); }.location-page md-list.usernavigation .presence-person::before { top:14px; bottom:14px; width:2px; background:linear-gradient(#82d9ff,#8be0b2); opacity:.74; }.location-page md-list.usernavigation .presence-person:hover { border-color:rgba(155,209,255,.30); background:linear-gradient(112deg,rgba(82,124,184,.27),rgba(27,35,58,.72) 67%); }
.location-page md-list.usernavigation .presence-person .presence-avatar { width:46px; height:46px; margin-right:12px; outline:1px solid rgba(149,222,251,.39); outline-offset:3px; }.location-page md-list.usernavigation .presence-person .presence-avatar img { width:46px; height:46px; }.location-page md-list.usernavigation .presence-person-copy .username { margin:0 0 4px; color:#f6f9ff; font-size:13px; font-weight:750; }.location-page md-list.usernavigation .presence-person-copy p:last-child { color:#9eafc4; font-size:10px; }.location-page md-list.usernavigation .presence-person-copy p:last-child .material-icons { color:#84dcb1; font-size:11px; }
.location-page md-list.usernavigation .presence-actions { gap:4px; margin-left:8px; padding:3px; border:1px solid rgba(255,255,255,.07); border-radius:12px; background:rgba(5,10,21,.24); }.location-page md-list.usernavigation .presence-actions .presence-action { width:31px; height:31px; min-width:31px; padding:0; border:1px solid rgba(192,220,255,.11); border-radius:9px; background:rgba(255,255,255,.045); box-shadow:none; }.location-page md-list.usernavigation .presence-actions .presence-action .material-icons { font-size:16px; }.location-page md-list.usernavigation .presence-actions .presence-action:hover,.location-page md-list.usernavigation .presence-actions .presence-action:focus-visible { transform:translateY(-1px); filter:brightness(1.15); }.location-page md-list.usernavigation .presence-actions .presence-message { color:#dcd4ff; border-color:rgba(174,155,255,.28); background:rgba(132,107,234,.19); }.location-page md-list.usernavigation .presence-actions .presence-friend { color:#baf3dc; border-color:rgba(120,225,187,.26); background:rgba(71,178,143,.15); }.location-page md-list.usernavigation .presence-actions .presence-pending { color:#ffe1a8; background:rgba(180,126,55,.15); }.location-page md-list.usernavigation .presence-actions .presence-connected { color:#c5e9ff; background:rgba(72,137,191,.17); }.location-page md-list.usernavigation .presence-actions .presence-up { color:#ffe1a8; }

/* Geometry calibration endpoint: only the two equal symbol surfaces remain. */
.nearby .placeboard .distrat .location-cuddles strong,
.nearby .placeboard .distrat .distance a > span { display:none; }
.nearby .placeboard .distrat .location-cuddles,
.nearby .placeboard .distrat .distance a,
.nearby .placeboard .distrat .distance a > .material-icons { width:60px; min-width:60px; height:60px; border-radius:15px; box-sizing:border-box; }

/* Sidebar rendering endpoint.  Older global Material rules produced a black
   metallic header and boxed icons; this restores the single LinkUUp surface. */
.md-sidenav-left,.md-sidenav-left md-content { background:radial-gradient(ellipse 92% 30% at 12% 0,rgba(66,157,229,.16),transparent 70%),radial-gradient(ellipse 68% 34% at 94% 37%,rgba(126,86,211,.14),transparent 72%),linear-gradient(162deg,#111c30 0%,#151a2d 51%,#0f1422 100%); }
.md-sidenav-left md-toolbar.sidenav-brand,.md-sidenav-left .sidenav-brand { min-height:82px; background:radial-gradient(circle at 88% 24%,rgba(99,189,247,.32),transparent 29%),linear-gradient(115deg,#32295d 0%,#1a3158 56%,#121d33 100%); border-bottom:1px solid rgba(184,219,255,.17); box-shadow:inset 0 -1px 0 rgba(255,255,255,.055),0 8px 19px rgba(4,9,22,.22); }
.md-sidenav-left .sidenav-brand .md-toolbar-tools { height:82px; }.md-sidenav-left .sidenav-brand h1 { color:#f7fbff; font-weight:760; letter-spacing:-.035em; }.md-sidenav-left .sidenav-brand span { color:#b7d6f0; }
.md-sidenav-left md-list-item .nav-icon,.md-sidenav-left md-list-item.nav-discover .nav-icon,.md-sidenav-left md-list-item.nav-profile .nav-icon,.md-sidenav-left md-list-item.nav-friends .nav-icon,.md-sidenav-left md-list-item.nav-settings .nav-icon,.md-sidenav-left md-list-item.nav-account .nav-icon,.md-sidenav-left md-list-item.nav-profile-settings .nav-icon,.md-sidenav-left md-list-item.nav-logout .nav-icon { width:24px; height:24px; margin-right:14px; border:0; border-radius:0; background:transparent; box-shadow:none; font-size:19px; }
.md-sidenav-left md-list-item:hover .nav-icon { transform:translateX(1px); background:transparent; box-shadow:none; }.md-sidenav-left md-list-item::before { background:transparent; }.md-sidenav-left md-list-item:hover { border-color:transparent; background:linear-gradient(90deg,rgba(84,157,223,.18),rgba(123,92,202,.07) 68%,transparent); }.md-sidenav-left md-list-item:hover::before { background:#9fddff; box-shadow:0 0 11px rgba(129,208,255,.62); }

/* The Angular Material tools element must remain transparent; otherwise it
   paints a separate black strip inside the blue LinkUUp header. */
.md-sidenav-left .sidenav-brand .md-toolbar-tools { background:transparent; }

/* Location Cuddle: the code stays completely legible; the surrounding frame
   makes the real-world encounter feel deliberate instead of generic. */
.lup-location-cuddle-dialog { width:min(91vw,368px); border:1px solid rgba(173,210,255,.22); border-radius:27px; background:radial-gradient(circle at 50% -8%,rgba(105,172,255,.27),transparent 41%),radial-gradient(circle at 87% 50%,rgba(205,104,192,.16),transparent 34%),linear-gradient(154deg,#182a49,#14182b 62%,#101624); box-shadow:0 24px 64px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.09); }
.lup-location-cuddle-content { padding:28px 23px 22px; }.lup-location-cuddle-close { border:1px solid rgba(193,223,255,.18); background:rgba(8,17,36,.38); color:#dceeff; }.lup-location-cuddle-seal { position:relative; width:58px; height:58px; margin-bottom:10px; border:1px solid rgba(194,231,255,.46); border-radius:50%; background:radial-gradient(circle at 34% 26%,rgba(255,255,255,.40),transparent 24%),linear-gradient(145deg,#5bbde9,#6e69d5 64%,#ac609b); box-shadow:0 0 0 7px rgba(130,205,255,.07),0 13px 28px rgba(8,22,54,.40),inset 0 1px 0 rgba(255,255,255,.43); }.lup-location-cuddle-seal > .material-icons:first-child { font-size:29px; text-shadow:0 2px 5px rgba(48,38,112,.38); }.lup-location-cuddle-seal .cuddle-seal-qr { position:absolute; right:-4px; bottom:-4px; display:grid; place-items:center; width:23px; height:23px; border:1px solid rgba(232,249,255,.58); border-radius:8px; background:#172747; color:#dff5ff; font-size:14px; box-shadow:0 5px 13px rgba(5,13,35,.38); }
.lup-location-cuddle-eyebrow { color:#a9dcff; }.lup-location-cuddle-content h2 { margin-bottom:7px; font-size:20px; }.lup-location-cuddle-content > p:not(.lup-location-cuddle-note) { max-width:278px; color:#c4d3e8; font-size:12px; }
.lup-location-cuddle-frame { position:relative; display:grid; place-items:center; width:min(67vw,222px); margin:17px auto 10px; padding:9px; border:1px solid rgba(154,211,255,.28); border-radius:22px; background:linear-gradient(135deg,rgba(93,182,239,.12),rgba(158,105,215,.08)); box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 13px 30px rgba(2,10,30,.26); }.lup-location-cuddle-frame::before { content:''; position:absolute; inset:5px; border:1px solid rgba(241,217,255,.12); border-radius:17px; pointer-events:none; }.lup-location-cuddle-frame .lup-cuddles-qr { position:relative; z-index:1; padding:8px; border:0; border-radius:14px; box-shadow:0 7px 18px rgba(0,0,0,.28); }.lup-location-cuddle-frame .lup-cuddles-qr img { width:min(59vw,190px); }.lup-location-cuddle-frame-corner { position:absolute; z-index:2; width:13px; height:13px; border-color:#b9e8ff; border-style:solid; pointer-events:none; }.corner-a { top:5px; left:5px; border-width:2px 0 0 2px; border-radius:5px 0 0; }.corner-b { top:5px; right:5px; border-width:2px 2px 0 0; border-radius:0 5px 0 0; }.corner-c { bottom:5px; left:5px; border-width:0 0 2px 2px; border-radius:0 0 0 5px; }.corner-d { right:5px; bottom:5px; border-width:0 2px 2px 0; border-radius:0 0 5px 0; }
.lup-location-cuddle-scan { display:inline-flex; align-items:center; gap:5px; color:#bce8ff; font-size:10px; font-weight:800; letter-spacing:.055em; text-transform:uppercase; }.lup-location-cuddle-scan .material-icons { font-size:15px; color:#ffd1e3; }.lup-location-cuddle-rule { margin-top:15px; border-color:rgba(162,209,255,.16); background:rgba(96,133,207,.12); color:#d7e5f6; }.lup-location-cuddle-done { border-color:rgba(189,224,255,.25); background:linear-gradient(112deg,#477fbb,#695bb3); box-shadow:0 6px 0 rgba(28,42,99,.45),0 14px 23px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.30); }


.nearby .location-categories { isolation:isolate; -webkit-tap-highlight-color:transparent; }
.nearby .location-categories button { touch-action:manipulation; transform:translateZ(0); backface-visibility:hidden; will-change:transform; }
.nearby .location-categories button:active { transform:translateZ(0) scale(.965); transition:transform 70ms linear; }
.nearby .location-categories button:not(.active) { transition:color 150ms ease,background-color 150ms ease,border-color 150ms ease,opacity 150ms ease; }
.nearby .location-categories button.active { transition:color 150ms ease,background-color 150ms ease,border-color 150ms ease,opacity 150ms ease,transform 120ms ease; }

@media (prefers-reduced-motion:reduce) { .nearby .location-categories button { will-change:auto; } }

/* Small cleanup pass: settings have no decorative colour rail, and the
   profile statistics sit directly on the page rather than in a second frame. */
.profile-page .user-top-information { border:0; border-radius:0; background:transparent; box-shadow:none; }
.profile-page .user-top-information::before { display:none; }

/* One continuous profile field: the route stays behind avatar, about and
   gallery alike.  It never receives pointer events or affects document flow. */
.profile-page .user-profile-page {
  position:relative;
  isolation:isolate;
  overflow-x:hidden;
  background:
    radial-gradient(ellipse 90% 24% at 9% 7%,rgba(88,147,220,.13),transparent 66%),
    radial-gradient(ellipse 74% 28% at 92% 53%,rgba(121,87,205,.12),transparent 68%),
    linear-gradient(160deg,#111a2d 0%,#12182b 49%,#101522 100%);
}
.profile-page .user-profile-page > :not(.profile-ambient-map) { position:relative; z-index:1; }
.profile-page .profile-ambient-map { position:absolute; z-index:0; inset:0; min-height:100%; overflow:hidden; pointer-events:none; }
.profile-page .profile-ambient-map::before,
.profile-page .profile-ambient-map::after { content:''; position:absolute; display:block; border-radius:50%; pointer-events:none; }
.profile-page .profile-ambient-map::before { top:-105px; left:-166px; width:378px; height:378px; border:1px solid rgba(99,183,247,.14); background:radial-gradient(circle at 66% 67%,rgba(72,163,238,.11),transparent 47%); box-shadow:inset 0 0 56px rgba(81,153,235,.045),0 0 50px rgba(53,127,221,.045); animation:lup-profile-ring-drift-a 22s ease-in-out infinite; }
.profile-page .profile-ambient-map::after { top:35%; right:-208px; width:410px; height:410px; border:1px solid rgba(161,122,238,.105); background:radial-gradient(circle at 30% 34%,rgba(105,168,244,.09),transparent 47%); box-shadow:inset 0 0 62px rgba(132,93,223,.04),0 0 54px rgba(92,144,236,.04); animation:lup-profile-ring-drift-b 26s ease-in-out infinite; }
@keyframes lup-profile-ring-drift-a { 0%,100% { transform:translate3d(0,0,0) scale(1); opacity:.40; } 45% { transform:translate3d(28px,21px,0) scale(1.055); opacity:.76; } 72% { transform:translate3d(9px,44px,0) scale(.985); opacity:.48; } }
@keyframes lup-profile-ring-drift-b { 0%,100% { transform:translate3d(0,0,0) scale(1); opacity:.32; } 39% { transform:translate3d(-32px,18px,0) scale(1.05); opacity:.68; } 70% { transform:translate3d(-14px,-23px,0) scale(.97); opacity:.43; } }
.profile-page .avatar-bg { overflow:hidden; background:radial-gradient(ellipse 72% 58% at 50% 19%,rgba(96,164,232,.12),transparent 70%); }
.profile-page .user-top-information .countitem { background:linear-gradient(145deg,rgba(255,255,255,.115),rgba(255,255,255,.025) 44%,rgba(30,37,65,.07)); }
.profile-page .profile-section-nav { background:rgba(15,21,38,.20); backdrop-filter:blur(2px); }
.profile-page .information-tabs,.profile-page .information-tabs md-content,.profile-page .information-tabs .md-tab-content { background:transparent; }
.profile-page .profile-information.profile-about-single .profile-story-card { background:rgba(19,24,41,.18); }
.profile-page .profile-gallery,.profile-page .gallery-container { background:transparent; }

/* The profile switch is lit, not boxed.  One narrow cone makes the chosen
   section legible without adding another visible container to the profile. */
.profile-page .profile-section-nav {
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
}
.profile-page .profile-section-nav button,
.profile-page .profile-section-nav button.active,
.profile-page .profile-section-nav button:hover {
  overflow:hidden;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.profile-page .profile-section-nav button + button::before { display:none; content:none; }
.profile-page .profile-section-nav button::before { display:none; content:none; }
.profile-page .profile-section-nav button.active::before {
  display:block;
  content:'';
  position:absolute;
  z-index:0;
  top:-12px;
  left:13%;
  width:74%;
  height:57px;
  background:linear-gradient(180deg,rgba(190,181,255,.33),rgba(157,142,245,.11) 47%,rgba(118,181,238,0) 100%);
  clip-path:polygon(47% 0,53% 0,100% 100%,0 100%);
  filter:blur(.1px);
  opacity:.85;
}
.profile-page .profile-section-nav button.active::after {
  height:1px;
  background:linear-gradient(90deg,transparent 4%,rgba(164,151,255,.66) 27%,#d8d2ff 50%,rgba(135,197,245,.62) 73%,transparent 96%);
  box-shadow:0 0 9px rgba(178,164,255,.52);
}
.profile-page .profile-section-nav button > * { position:relative; z-index:1; }
.profile-page .profile-section-nav button.active .material-icons { color:#fbf9ff; text-shadow:0 0 13px rgba(194,181,255,.72); }
.profile-page .profile-section-nav button.active span { color:#fbfaff; text-shadow:0 0 10px rgba(184,171,255,.42); }
.profile-page .profile-section-nav button:first-child.active::before,
.profile-page .profile-section-nav button:nth-child(2).active::before { opacity:1; }
.profile-page .profile-section-nav button:first-child.active .material-icons,
.profile-page .profile-section-nav button:nth-child(2).active .material-icons { color:#fbf9ff; text-shadow:0 0 13px rgba(194,181,255,.72); }
.profile-page .profile-section-nav button:first-child.active span,
.profile-page .profile-section-nav button:nth-child(2).active span { color:#fbfaff; text-shadow:0 0 10px rgba(184,171,255,.42); }
/* The legacy divider used and hid the second tab's ::before.  Both
   profile choices now expose the same lamp cone when active. */
.profile-page .profile-section-nav button:nth-child(2).active::before {
  display:none;
  content:none;
}
.profile-page .profile-section-nav button:first-child.active::before { display:none; content:none; }
.profile-page .profile-ambient-route { position:absolute; display:block; border:1px solid rgba(147,198,255,.09); border-radius:50%; }
.profile-page .profile-ambient-route-one { top:5%; right:-43%; width:112%; height:31%; transform:rotate(-24deg); }
.profile-page .profile-ambient-route-two { top:42%; left:-47%; width:107%; height:25%; border-color:rgba(182,147,255,.075); transform:rotate(19deg); }
.profile-page .profile-ambient-route-three { bottom:4%; right:-44%; width:102%; height:30%; border-color:rgba(128,194,245,.065); transform:rotate(-17deg); }
.profile-page .profile-ambient-node { position:absolute; display:block; width:4px; height:4px; border-radius:50%; background:rgba(198,226,255,.58); box-shadow:0 0 12px rgba(104,193,255,.42); }
.profile-page .profile-ambient-node-one { top:15%; right:21%; opacity:.42; }
.profile-page .profile-ambient-node-two { top:54%; left:14%; background:rgba(205,177,255,.54); box-shadow:0 0 12px rgba(173,126,255,.35); opacity:.31; }
.profile-page .profile-ambient-node-three { bottom:17%; right:29%; opacity:.25; }
.profile-page .profile-ambient-focus { position:absolute; top:92px; left:50%; display:block; width:172px; height:76px; border:1px solid rgba(157,211,255,.13); border-radius:50%; box-shadow:0 0 26px rgba(88,170,243,.11),inset 0 0 20px rgba(161,130,242,.04); transform:translateX(-50%) rotate(-12deg); animation:lup-profile-focus-breathe 8s ease-in-out infinite; }
.profile-page .profile-ambient-signal { position:absolute; top:23%; right:12%; display:block; width:8px; height:8px; border-radius:50%; background:#c9efff; box-shadow:0 0 0 4px rgba(99,183,246,.07),0 0 18px rgba(95,195,255,.78); animation:lup-profile-route-signal 18s ease-in-out infinite; }
@keyframes lup-profile-focus-breathe { 0%,100% { opacity:.28; transform:translateX(-50%) rotate(-12deg) scale(.96); } 50% { opacity:.66; transform:translateX(-50%) rotate(-12deg) scale(1.035); } }
@keyframes lup-profile-route-signal { 0%,100% { transform:translate3d(0,0,0); opacity:.28; } 22% { opacity:.78; } 47% { transform:translate3d(-106px,58px,0); opacity:.88; } 62% { opacity:.33; } 80% { transform:translate3d(-38px,126px,0); opacity:.57; } }
@media (max-width:480px) { .profile-page .profile-ambient-route-one { right:-58%; width:132%; height:27%; } .profile-page .profile-ambient-route-two { left:-62%; width:132%; } .profile-page .profile-ambient-route-three { right:-61%; width:130%; } .profile-page .profile-ambient-signal { top:20%; right:8%; } }
@media (prefers-reduced-motion:reduce) { .profile-page .profile-ambient-signal,.profile-page .profile-ambient-focus,.profile-page .profile-ambient-map::before,.profile-page .profile-ambient-map::after { animation:none; } }

/* Gallery upload becomes a single glass invitation.  It inherits the live
   profile field instead of looking like a separate technical drop zone. */
.profile-page .gallery-add-tile {
  position:relative;
  isolation:isolate;
  gap:10px;
  overflow:hidden;
  border:1px solid rgba(187,220,255,.25);
  border-radius:20px;
  background:linear-gradient(145deg,rgba(139,192,245,.14),rgba(119,92,203,.08) 52%,rgba(18,29,53,.10));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.20),inset 0 -1px 0 rgba(14,21,45,.16),0 12px 25px rgba(1,8,25,.14);
  backdrop-filter:blur(5px);
  color:#e6f4ff;
}
.profile-page .gallery-add-tile::before {
  display:block;
  content:'';
  position:absolute;
  z-index:-1;
  top:-45%;
  left:-25%;
  width:105%;
  height:82%;
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(255,255,255,.22),rgba(194,225,255,.045) 38%,transparent 68%);
  transform:rotate(-18deg);
}
.profile-page .gallery-add-tile::after {
  content:'';
  position:absolute;
  z-index:-1;
  right:14%;
  bottom:14px;
  left:14%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(202,235,255,.38),transparent);
  box-shadow:0 0 10px rgba(130,197,255,.25);
}
.profile-page .gallery-add-tile .material-icons {
  position:relative;
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  border:1px solid rgba(229,246,255,.46);
  border-radius:15px;
  background:linear-gradient(145deg,rgba(179,221,255,.36),rgba(93,148,218,.22));
  box-shadow:0 7px 0 rgba(36,69,130,.30),0 13px 22px rgba(4,16,43,.20),inset 0 1px 0 rgba(255,255,255,.48);
  color:#f4fbff;
  font-size:23px;
  text-shadow:0 2px 6px rgba(49,92,166,.35);
}
.profile-page .gallery-add-tile span { display:block; color:#e0efff; font:760 10px/1 Ubuntu,Roboto,Arial,sans-serif; letter-spacing:.07em; text-transform:uppercase; text-shadow:0 1px 8px rgba(32,76,142,.30); }
.profile-page .gallery-add-tile:hover,.profile-page .gallery-add-tile:focus-visible { transform:translateY(-2px); border-color:rgba(213,239,255,.52); background:linear-gradient(145deg,rgba(151,207,255,.22),rgba(139,104,224,.13) 52%,rgba(23,38,67,.16)); box-shadow:inset 0 1px 0 rgba(255,255,255,.27),0 16px 30px rgba(1,8,25,.19),0 0 21px rgba(111,175,247,.12); outline:0; }
.profile-page .gallery-add-tile:hover .material-icons,.profile-page .gallery-add-tile:focus-visible .material-icons { box-shadow:0 7px 0 rgba(36,69,130,.30),0 13px 25px rgba(4,16,43,.23),0 0 15px rgba(172,221,255,.26),inset 0 1px 0 rgba(255,255,255,.50); }
/* iOS keeps :hover after a tap.  A gallery button must open the picker without
   pretending to float away from the finger. */
@media (hover:none), (pointer:coarse) {
  .profile-page .gallery-add-tile:hover,
  .profile-page .gallery-add-tile:active { transform:none; }
}
.profile-page .gallery-empty { display:grid; justify-items:center; gap:8px; margin:10px 12px 28px; padding:30px 18px; border:1px dashed rgba(184,211,255,.18); border-radius:18px; background:rgba(16,24,42,.28); color:#aab9d1; font:650 12px/1.45 Ubuntu,Roboto,Arial,sans-serif; text-align:center; }
.profile-page .gallery-empty .material-icons { color:#b7dcff; font-size:27px; filter:drop-shadow(0 0 10px rgba(104,183,255,.28)); }

/* The add-photo slot should read as part of the album, not as a second card.
 * One calm camera-plus mark is enough; real gallery images stay visually first. */
.profile-page .gallery-add-tile {
  border:0;
  border-radius:15px;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  color:rgba(193,227,255,.78);
}
.profile-page .gallery-add-tile::before,
.profile-page .gallery-add-tile::after {
  display:block;
  content:'';
  position:absolute;
  border-radius:50%;
  pointer-events:none;
}
.profile-page .gallery-add-tile::before {
  width:5px;
  height:5px;
  top:calc(50% - 29px);
  left:calc(50% + 24px);
  background:#e9fbff;
  box-shadow:0 0 9px rgba(133,220,255,.84);
  animation:gallery-add-glint 3.8s ease-in-out infinite;
}
.profile-page .gallery-add-tile::after {
  width:2px;
  height:2px;
  top:calc(50% + 23px);
  left:calc(50% - 31px);
  background:rgba(185,225,255,.90);
  box-shadow:0 0 7px rgba(130,194,255,.75);
  animation:gallery-add-glint 3.8s ease-in-out 1.2s infinite;
}
.profile-page .gallery-add-tile .material-icons {
  width:auto;
  height:auto;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:transparent;
  background:linear-gradient(135deg,#f1fcff 4%,#a7dfff 46%,#9c9cff 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  font-size:42px;
  line-height:1;
  filter:drop-shadow(0 0 10px rgba(104,190,255,.34));
}
.profile-page .gallery-add-tile:hover,
.profile-page .gallery-add-tile:focus-visible {
  border:0;
  background:transparent;
  box-shadow:none;
  color:#e3f5ff;
  transform:scale(1.045);
}
.profile-page .gallery-add-tile:hover .material-icons,
.profile-page .gallery-add-tile:focus-visible .material-icons {
  box-shadow:none;
  filter:drop-shadow(0 0 12px rgba(128,205,255,.55));
}
@keyframes gallery-add-glint { 0%,100% { opacity:.35; transform:scale(.72); } 48% { opacity:1; transform:scale(1.15); } }
@media (prefers-reduced-motion:reduce) { .profile-page .gallery-add-tile::before,.profile-page .gallery-add-tile::after { animation:none; } }

/* High Five confirmation: a real encounter gets a clear, composed scan moment
 * instead of the former generic heart dialog. */
.lup-cuddles-dialog.highfive-qr-dialog {
  width:min(91vw,360px);
  overflow:hidden;
  border:1px solid rgba(178,222,255,.20);
  border-radius:26px;
  background:radial-gradient(circle at 50% -7%,rgba(102,183,244,.26),transparent 39%),radial-gradient(circle at 92% 58%,rgba(167,104,202,.13),transparent 33%),linear-gradient(156deg,#172943,#111827 67%,#0d1423);
  box-shadow:0 25px 66px rgba(0,0,0,.50),inset 0 1px 0 rgba(255,255,255,.10);
}
.highfive-qr-dialog-content { padding:27px 22px 23px; text-align:center; }
.highfive-qr-dialog .lup-cuddles-close { border:1px solid rgba(194,224,255,.16); background:rgba(8,17,35,.36); color:#dceeff; }
.highfive-qr-mark { position:relative; display:grid; place-items:center; width:58px; height:58px; margin:0 auto 10px; border:1px solid rgba(198,234,255,.43); border-radius:50%; background:radial-gradient(circle at 34% 25%,rgba(255,255,255,.40),transparent 24%),linear-gradient(145deg,#5ebce8,#656dd1 66%,#a35f9c); box-shadow:0 0 0 7px rgba(121,202,255,.06),0 13px 29px rgba(6,20,48,.40),inset 0 1px 0 rgba(255,255,255,.42); color:#f4fbff; }
.highfive-qr-mark > .material-icons:first-child { font-size:30px; text-shadow:0 2px 5px rgba(34,45,104,.42); }.highfive-qr-mark > .material-icons:last-child { position:absolute; right:-4px; bottom:-3px; display:grid; place-items:center; width:23px; height:23px; border:1px solid rgba(233,249,255,.58); border-radius:8px; background:#172847; color:#dff5ff; box-shadow:0 5px 13px rgba(4,13,33,.40); font-size:14px; }
.highfive-qr-eyebrow { display:block; color:#a8dcff; font-size:9px; font-weight:880; letter-spacing:.15em; }.highfive-qr-dialog h2 { margin:5px 0 7px; color:#f2f7ff; font-size:21px; line-height:1.13; }.highfive-qr-dialog p { max-width:278px; margin:0 auto; color:#c2d2e5; font-size:12px; line-height:1.45; }
.highfive-qr-frame { position:relative; display:grid; place-items:center; width:min(67vw,218px); margin:17px auto 11px; padding:9px; background:linear-gradient(135deg,rgba(95,185,242,.11),rgba(152,103,214,.07)); }.highfive-qr-frame::before,.highfive-qr-frame::after { content:''; position:absolute; width:18px; height:18px; border-color:#b9e9ff; border-style:solid; opacity:.86; pointer-events:none; }.highfive-qr-frame::before { top:0; left:0; border-width:1px 0 0 1px; }.highfive-qr-frame::after { right:0; bottom:0; border-width:0 1px 1px 0; }.highfive-qr-frame .lup-cuddles-qr { padding:8px; border:0; border-radius:12px; box-shadow:0 9px 22px rgba(0,0,0,.28); }.highfive-qr-frame .lup-cuddles-qr img { display:block; width:min(59vw,188px); height:auto; }
.highfive-qr-rule { display:flex; align-items:flex-start; justify-content:center; gap:6px; max-width:272px; margin:0 auto; color:#aebfd4; font-size:10px; line-height:1.35; }.highfive-qr-rule .material-icons { flex:0 0 auto; color:#9ee6c5; font-size:15px; }

/* Mobile composer safety: the visible viewport shrinks when a phone keyboard
 * opens. Keep the message stream scrollable and the composer inside that
 * viewport instead of letting it disappear behind the keyboard. */
@media (max-width: 600px) {
  .location-page > md-content,
  .query-page > md-content {
    height:var(--lup-viewport-height,100dvh);
    min-height:0;
    overflow:hidden;
  }
  .location-page md-tabs,
  .location-page md-tabs-content-wrapper,
  .location-page .md-tab-content,
  .query-page > md-content > ng-include {
    min-height:0;
  }
  .location-page .location-chat-surface,
  .query-page > md-content {
    min-height:0;
  }
  .location-page .location-chat-surface {
    height:100%;
    overflow:hidden;
  }
  .location-page .location-chat-surface .chat-msgs,
  .query-page .chat-msgs {
    min-height:0;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
  .location-page .location-chat-surface .chatbottom,
  .query-page .chatbottom {
    flex:0 0 auto;
    padding-bottom:max(9px,env(safe-area-inset-bottom));
  }
}

/* Final inbox layout: messages use the whole horizontal content rail. */
.notification .notification-panel .inbox-message-list .inbox-thread-card {
  display:flex;
  align-items:center;
  width:100%;
  min-height:68px;
  box-sizing:border-box;
  margin:0;
  padding:10px 13px 10px 12px;
  border:0;
  border-bottom:1px solid rgba(192,214,242,.10);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.notification .notification-panel .inbox-message-list .inbox-thread-card:first-child { border-top:1px solid rgba(192,214,242,.07); }
.notification .notification-panel .inbox-thread-avatar {
  display:grid;
  place-items:center;
  align-self:center;
  flex:0 0 42px;
  width:42px;
  height:42px;
  margin:0 12px 0 0;
}
.notification .notification-panel .inbox-thread-avatar .lup-avatar,
.notification .notification-panel .inbox-thread-avatar .lup-avatar img {
  display:block;
  width:42px;
  height:42px;
  margin:0;
  transform:none;
}
.notification .notification-panel .inbox-thread-avatar .lup-avatar {
  border:1px solid rgba(180,215,246,.28);
  outline:0;
  box-shadow:0 4px 12px rgba(2,10,29,.16);
}
@media (max-width:360px) { .notification .notification-panel .inbox-message-list .inbox-thread-card { padding-right:10px; padding-left:9px; }.notification .notification-panel .inbox-thread-avatar,.notification .notification-panel .inbox-thread-avatar .lup-avatar,.notification .notification-panel .inbox-thread-avatar .lup-avatar img { flex-basis:38px; width:38px; height:38px; } }
/* Browsers must not draw a white native focus rectangle around “Alle”.
   Keyboard users still receive the same quiet LinkUUp focus signal. */
.nearby .location-categories button:focus { outline:0; }
.nearby .location-categories button:focus-visible { outline:1px solid rgba(156,211,255,.72); outline-offset:3px; }

/* Current-guest marker: count first, then a restrained live signal. */
.nearby .placeboard .room-presence-count { gap:5px; min-height:29px; padding:4px 8px; border:1px solid rgba(116,222,175,.20); border-radius:999px; background:rgba(38,87,73,.25); color:#dff8eb; box-shadow:none; }
.nearby .placeboard .room-presence-count .material-icons { display:none; }
.nearby .placeboard .room-presence-count::before { content:''; width:7px; height:7px; border-radius:50%; background:#7de4aa; box-shadow:0 0 0 3px rgba(125,228,170,.11),0 0 11px rgba(125,228,170,.44); }
.nearby .placeboard .room-presence-count b { min-width:17px; height:17px; background:rgba(109,203,157,.24); color:#f3fff8; }

@media (min-width:560px) { .location-page md-list.usernavigation .presence-actions .presence-action { width:auto; min-width:33px; padding:0 8px; }.location-page md-list.usernavigation .presence-actions .presence-action span { display:inline; font-size:9px; font-weight:800; } }
@media (max-width:360px) { .location-page md-list.usernavigation { padding-right:11px; padding-left:11px; }.location-page md-list.usernavigation .presence-person { padding-right:7px; padding-left:9px; }.location-page md-list.usernavigation .presence-person .presence-avatar,.location-page md-list.usernavigation .presence-person .presence-avatar img { width:40px; height:40px; }.location-page md-list.usernavigation .presence-actions { gap:2px; margin-left:4px; }.location-page md-list.usernavigation .presence-actions .presence-action { width:28px; height:28px; min-width:28px; } }
@media (prefers-reduced-motion:reduce) { .location-page md-list.usernavigation .presence-live-mark .material-icons { animation:none; } }

/* Final inbox geometry: content to the edge, avatar centred, forum control
   fixed at the far right instead of Material's old secondary offset. */
.notification .notification-panel .inbox-message-list .inbox-thread-card { display:flex; align-items:center; width:100%; margin:0; padding:10px 12px; }
.notification .notification-panel .inbox-thread-avatar { display:block; flex:0 0 42px; align-self:center; width:42px; height:42px; margin:0 12px 0 0; padding:0; }
.notification .notification-panel .inbox-thread-avatar .lup-avatar { display:block; width:42px; height:42px; margin:0; padding:0; overflow:hidden; }
.notification .notification-panel .inbox-thread-avatar .lup-avatar .img,.notification .notification-panel .inbox-thread-avatar .lup-avatar span { top:0; left:0; width:100%; height:100%; margin:0; }
.notification .notification-panel .inbox-thread-copy { min-width:0; }
.notification .notification-panel .inbox-thread-open.md-secondary,.notification .notification-panel .inbox-thread-open { position:static; right:auto; margin:0 0 0 auto; }

/* Query layout wins against every legacy message selector above. */
.query-page .query-message-card { display:flex; align-items:center; width:100%; min-height:62px; margin:0; padding:10px 13px; gap:12px; }
.query-page .query-message-avatar { display:block; flex:0 0 42px; width:42px; height:42px; padding:0; margin:0; overflow:hidden; }
.query-page .query-message-avatar .img,.query-page .query-message-avatar span { position:absolute; top:0; left:0; width:100%; height:100%; margin:0; }
.query-page .query-message-content { display:flex; flex:1 1 auto; flex-direction:column; justify-content:center; min-width:0; min-height:42px; }
.query-page .query-message-content .message { position:relative; display:block; width:100%; min-height:20px; padding:2px 0 3px; border:0; border-radius:0; background:transparent; text-align:left; }
.query-page .query-message-content .message::after { content:''; position:absolute; right:0; bottom:0; left:0; height:1px; background:linear-gradient(90deg,rgba(150,197,246,.28),rgba(150,197,246,.035)); }
.query-page .query-message-content .messager-inner,.query-page .query-message-content .lup-message-state { position:relative; z-index:1; }
.query-page .query-message-content .lup-message-state { right:auto; bottom:auto; left:auto; }
.query-page .lup-own-msg .query-message-card { flex-direction:row-reverse; }
.query-page .lup-own-msg .query-message-content { text-align:right; }
.query-page .lup-own-msg .query-message-content .message { text-align:right; }
.query-page .lup-own-msg .query-message-content .message::after { background:linear-gradient(90deg,rgba(150,197,246,.035),rgba(150,197,246,.28)); }

/* The forum button stays in the row flow all the way to the right edge. */
.notification .notification-panel .inbox-message-list .inbox-thread-card .md-list-item-inner { display:flex; align-items:center; width:100%; padding:0; }
.notification .notification-panel .inbox-message-list .inbox-thread-open { position:static; display:grid; flex:0 0 34px; align-self:center; width:34px; height:34px; min-width:34px; margin:0 0 0 auto; }

/* Material may generate a secondary wrapper depending on template timing.
   Anchor either form to the same physical right edge. */
.notification .notification-panel .inbox-message-list .inbox-thread-card { position:relative; padding-right:56px; }
.notification .notification-panel .inbox-message-list .inbox-thread-open,
.notification .notification-panel .inbox-message-list .inbox-thread-card .md-secondary-container {
  position:absolute;
  top:50%;
  right:7px;
  left:auto;
  margin:0;
  transform:translateY(-50%);
  z-index:2;
}
.notification .notification-panel .inbox-message-list .inbox-thread-card .md-secondary-container { display:flex; align-items:center; }

/* The inbox must own the full panel width; otherwise Material measures a
   shrink-to-fit list and the action can never reach the visible right edge. */
.notification .notification-panel,
.notification .notification-panel > ng-include,
.notification .notification-panel > ng-include > md-content,
.notification .notification-panel .inbox-message-list,
.notification .notification-panel .inbox-message-list > md-list-item.inbox-thread-card {
  width:100%;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
}

/* High Fives are an encounter ledger: personal, calm and clearly distinct
   from the public score or a generic friend list. */
.highfive-page > md-content { position:relative; isolation:isolate; overflow-x:hidden; background:radial-gradient(ellipse at 93% 6%,rgba(101,175,240,.16),transparent 32%),radial-gradient(ellipse at 7% 88%,rgba(174,110,205,.12),transparent 39%),linear-gradient(160deg,#101726 0%,#101421 53%,#151126 100%); color:#edf4ff; }
.highfive-page > md-content::before,.highfive-page > md-content::after { content:''; position:absolute; z-index:0; border:1px solid rgba(153,211,255,.09); border-radius:50%; pointer-events:none; }.highfive-page > md-content::before { top:18%; right:-40%; width:104%; height:30%; transform:rotate(-24deg); }.highfive-page > md-content::after { bottom:10%; left:-43%; width:110%; height:28%; border-color:rgba(196,150,255,.08); transform:rotate(18deg); }.highfive-page > md-content > :not(.lup-top-bar) { position:relative; z-index:1; }
.highfive-hero { display:grid; grid-template-columns:48px minmax(0,1fr); gap:12px; align-items:center; margin:17px 14px 10px; padding:15px 14px; border:1px solid rgba(185,219,255,.15); border-radius:19px; background:linear-gradient(135deg,rgba(72,117,176,.24),rgba(52,38,97,.18)); box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 12px 28px rgba(2,10,29,.14); }.highfive-hero-mark { display:grid; place-items:center; width:48px; height:48px; border:1px solid rgba(205,235,255,.30); border-radius:16px 16px 16px 6px; background:linear-gradient(145deg,rgba(100,187,240,.38),rgba(126,95,205,.27)); box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 8px 18px rgba(7,25,65,.22); color:#ebf8ff; }.highfive-hero-mark .material-icons { font-size:26px; }.highfive-hero-copy { min-width:0; }.highfive-hero-copy > span,.highfive-entry-copy > span { display:block; color:#9edcff; font-size:8px; font-weight:850; letter-spacing:.12em; line-height:1.2; }.highfive-hero-copy h1 { overflow:hidden; margin:4px 0 5px; color:#f1f6ff; font-size:18px; font-weight:780; line-height:1.13; text-overflow:ellipsis; white-space:nowrap; }.highfive-hero-copy p { margin:0; color:#b9c8dd; font-size:11px; line-height:1.4; }
.highfive-rule { display:flex; gap:9px; align-items:center; margin:0 14px 12px; padding:10px 12px; border-left:2px solid #8ed9ff; background:rgba(113,170,233,.07); color:#dceaff; }.highfive-rule > .material-icons { color:#aee8ff; font-size:20px; }.highfive-rule div { min-width:0; }.highfive-rule strong,.highfive-rule span { display:block; }.highfive-rule strong { font-size:10px; font-weight:790; }.highfive-rule span { margin-top:2px; color:#a9b8cd; font-size:10px; line-height:1.35; }
.highfive-ledger { margin:0 14px; }.highfive-entry { display:grid; grid-template-columns:42px minmax(0,1fr) 26px; gap:11px; align-items:center; min-height:67px; padding:10px 2px; border-bottom:1px solid rgba(191,213,243,.10); }.highfive-entry:first-child { border-top:1px solid rgba(191,213,243,.07); }.highfive-avatar,.highfive-avatar .img,.highfive-avatar span { width:42px; height:42px; }.highfive-avatar { display:block; margin:0; padding:0; overflow:hidden; border:1px solid rgba(173,220,255,.28); box-shadow:0 5px 14px rgba(1,9,25,.22); }.highfive-avatar .img,.highfive-avatar span { top:0; left:0; margin:0; }.highfive-entry-copy { min-width:0; }.highfive-entry-copy strong { display:block; overflow:hidden; margin:3px 0; color:#f2f7ff; font-size:13px; font-weight:760; line-height:1.15; text-overflow:ellipsis; white-space:nowrap; }.highfive-entry-copy small { display:flex; align-items:center; gap:4px; color:#aab8cc; font-size:10px; }.highfive-entry-copy small .material-icons { color:#92dfff; font-size:12px; }.highfive-entry-seal { display:grid; place-items:center; width:26px; height:26px; border:1px solid rgba(135,224,190,.23); border-radius:50%; background:rgba(79,177,138,.12); color:#9de7c5; font-size:16px; box-shadow:0 0 14px rgba(102,222,170,.10); }
.highfive-empty { display:grid; justify-items:center; gap:7px; padding:43px 19px; color:#b7c4d7; text-align:center; }.highfive-empty > div { display:grid; place-items:center; width:46px; height:46px; border:1px solid rgba(175,218,255,.20); border-radius:17px 17px 17px 6px; background:rgba(105,165,224,.10); color:#bfeaff; }.highfive-empty > div .material-icons { font-size:25px; }.highfive-empty strong { color:#e8f0fb; font-size:13px; }.highfive-empty p { max-width:244px; margin:0; color:#aab8ce; font-size:11px; line-height:1.45; }.highfive-footnote { display:flex; align-items:center; justify-content:center; gap:5px; margin:16px 18px 28px; color:#8190aa; font-size:9px; text-align:center; }.highfive-footnote .material-icons { color:#91bddb; font-size:12px; }
@media (max-width:360px) { .highfive-hero { grid-template-columns:43px minmax(0,1fr); margin-right:10px; margin-left:10px; padding:12px 11px; }.highfive-hero-mark { width:43px; height:43px; }.highfive-hero-copy h1 { font-size:16px; }.highfive-rule,.highfive-ledger { margin-right:10px; margin-left:10px; } }

/* Own-profile High Five choice: one compact, clear fork between scanning and
   reviewing the personal encounter history. */
.lup-cuddles-dialog:has(.highfive-choice-content) { width:min(91vw,370px); border-color:rgba(177,221,255,.24); border-radius:25px; background:radial-gradient(circle at 50% -10%,rgba(103,177,245,.29),transparent 40%),radial-gradient(circle at 90% 55%,rgba(186,104,205,.14),transparent 34%),linear-gradient(154deg,#172949,#12182a 67%,#101524); box-shadow:0 24px 62px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.10); }.highfive-choice-content { padding:27px 20px 19px; text-align:center; }.highfive-choice-mark { display:grid; place-items:center; width:58px; height:58px; margin:0 auto 9px; border:1px solid rgba(208,239,255,.42); border-radius:50%; background:radial-gradient(circle at 34% 25%,rgba(255,255,255,.38),transparent 24%),linear-gradient(145deg,#63bbe9,#686bd4 65%,#aa619d); box-shadow:0 0 0 7px rgba(118,200,255,.07),0 13px 28px rgba(8,22,54,.40),inset 0 1px 0 rgba(255,255,255,.40); color:#f2fbff; }.highfive-choice-mark .material-icons { font-size:30px; }.highfive-choice-eyebrow { display:block; color:#a9ddff; font-size:9px; font-weight:880; letter-spacing:.15em; }.highfive-choice-content h2 { margin:5px 0 6px; color:#f4f8ff; font-size:21px; line-height:1.12; }.highfive-choice-content > p { max-width:278px; margin:0 auto 16px; color:#bfcee2; font-size:12px; line-height:1.42; }.highfive-choice-actions { display:grid; gap:8px; }.highfive-choice-card { display:grid; grid-template-columns:35px minmax(0,1fr) 17px; gap:10px; align-items:center; width:100%; min-height:62px; padding:10px; border:1px solid rgba(190,219,255,.15); border-radius:16px; background:rgba(255,255,255,.048); color:#eef6ff; font:inherit; text-align:left; cursor:pointer; transition:transform 160ms ease,border-color 160ms ease,background 160ms ease,box-shadow 160ms ease; }.highfive-choice-card > .material-icons:first-child { display:grid; place-items:center; width:35px; height:35px; border:1px solid rgba(208,237,255,.26); border-radius:12px 12px 12px 5px; background:rgba(107,174,229,.17); color:#c9efff; font-size:19px; }.highfive-choice-card span { min-width:0; }.highfive-choice-card strong,.highfive-choice-card small { display:block; }.highfive-choice-card strong { color:#f1f6ff; font-size:12px; font-weight:780; }.highfive-choice-card small { margin-top:3px; color:#9fadc4; font-size:10px; line-height:1.28; }.highfive-choice-arrow { color:#91ccef; font-size:17px; }.highfive-choice-qr { border-color:rgba(143,213,255,.25); background:linear-gradient(116deg,rgba(78,159,216,.21),rgba(104,78,181,.13)); }.highfive-choice-history > .material-icons:first-child { color:#dacaff; border-color:rgba(204,185,255,.24); background:rgba(141,111,211,.16); }.highfive-choice-card:hover,.highfive-choice-card:focus-visible { border-color:rgba(191,224,255,.42); background:rgba(120,177,233,.13); box-shadow:0 10px 21px rgba(2,10,30,.18),inset 0 1px 0 rgba(255,255,255,.10); outline:0; transform:translateY(-1px); }.highfive-choice-note { display:flex; align-items:center; justify-content:center; gap:5px; margin-top:13px; color:#90a2bd; font-size:9px; line-height:1.35; }.highfive-choice-note .material-icons { color:#a7dff7; font-size:13px; }

/* Registration needs real field rhythm on mobile.  Its floating Material
   labels are made explicit here so they cannot collapse into the next field. */
.register-page .register-panel md-input-container { display:flex; flex-direction:column; align-items:stretch; height:62px; min-height:62px; margin:0 0 12px; padding:0; box-sizing:border-box; border:0; border-radius:0; background:transparent; box-shadow:none; }
.register-page .register-panel md-input-container > label { position:static; display:block; min-height:14px; margin:0 0 4px 2px; padding:0; transform:none; line-height:14px; }
.register-page .register-panel md-input-container .md-input,.register-page .register-panel md-input-container input { position:static; top:auto; width:100%; min-height:42px; height:42px; margin:0; padding:0 13px; border:1px solid rgba(190,218,250,.16); border-radius:13px; background:rgba(5,10,21,.42); box-shadow:inset 0 1px 0 rgba(255,255,255,.04); line-height:42px; }
.register-page .register-panel md-input-container .md-errors-spacer { display:none; }
.register-page .register-panel md-input-container .error { position:static; min-height:0; margin-top:4px; }
.register-page .register-panel .tos-line { display:grid; grid-template-columns:24px minmax(0,1fr); column-gap:9px; align-items:start; min-height:0; margin:3px 1px 16px; }
.register-page .register-panel .tos-line .check { position:static; grid-column:1; margin:1px 0 0; }
.register-page .register-panel .tos-line span { position:static; grid-column:2; padding:0; font-size:11px; line-height:1.45; }
.register-page .register-panel .tos-line .error { grid-column:2; }
.register-page .register-panel md-input-container.md-input-focused,.register-page .register-panel md-input-container:focus-within { border:0; background:transparent; box-shadow:none; }
.register-page .register-panel md-input-container.md-input-focused::after,.register-page .register-panel md-input-container:focus-within::after { background:#9bdff5; box-shadow:0 0 8px rgba(105,215,243,.34); }
.register-page .register-panel md-input-container .md-input:focus,.register-page .register-panel md-input-container input:focus { outline:0; border-color:rgba(128,213,241,.64); background:rgba(8,18,31,.64); box-shadow:0 0 0 2px rgba(93,204,236,.10),inset 0 1px 0 rgba(255,255,255,.05); }

/* The sign-up route is one short decision, not a long form.  Keep its mobile
   composition inside a single phone screen while retaining comfortable taps. */
.register-page .auth-hero-copy { max-width:468px; }
.register-page .login-brand-claim { max-width:292px; white-space:normal; }
.register-page .auth-canvas { isolation:isolate; background:#0b1020; }
.register-page .auth-canvas::before { background:radial-gradient(ellipse 54% 32% at 18% 16%,rgba(78,160,222,.19),transparent 72%),radial-gradient(ellipse 46% 30% at 83% 59%,rgba(114,83,196,.15),transparent 74%),radial-gradient(ellipse 55% 28% at 25% 92%,rgba(61,151,205,.10),transparent 75%),linear-gradient(160deg,#111b2d 0%,#0b1020 55%,#0b0f1c 100%); }
.register-page .auth-canvas::after { opacity:.56; animation:register-ambient-drift 22s ease-in-out infinite alternate; }
.register-page .register-panel { border:0; background:transparent; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
.register-page .auth-legal { border-top:0; background:transparent; }
.register-ambient-route { position:absolute; z-index:0; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; opacity:.68; transform:translate3d(0,0,0); animation:register-ambient-drift 20s ease-in-out infinite alternate; }
.register-ambient-base { fill:none; stroke:rgba(160,215,247,.21); stroke-width:1.15; vector-effect:non-scaling-stroke; }
.register-ambient-base-lower { stroke:rgba(158,142,244,.18); }
.register-ambient-point { fill:#d5f5ff; stroke:#8ed3f4; stroke-width:2; vector-effect:non-scaling-stroke; filter:drop-shadow(0 0 6px rgba(123,207,255,.8)); transform-origin:center; animation:register-ambient-pulse 5.6s ease-in-out infinite; }
.register-ambient-point-late { animation-delay:2.7s; }
@keyframes register-ambient-drift { from { transform:translate3d(-.7%,-.35%,0); opacity:.37; } to { transform:translate3d(.7%,.35%,0); opacity:.58; } }
@keyframes register-ambient-pulse { 0%,100% { opacity:.38; transform:scale(.72); } 48% { opacity:1; transform:scale(1.28); } }
.register-page .register-panel .login-button { margin-top:5px; }
.register-page .register-panel .backtologin { display:flex; align-items:center; justify-content:center; margin-top:8px; padding:0; line-height:1; }
@media (max-width:780px) {
  .register-page .auth-hero { min-height:249px; }
  .register-page .auth-hero-copy { padding:18px 28px; }
  .register-page .auth-hero-meta { margin-bottom:11px; }
  .register-page .login-wordmark { font-size:48px; }
  .register-page .login-brand-claim { margin-top:9px; font-size:18px; line-height:1.15; }
  .register-page .register-panel { margin:12px auto 10px; padding:22px 22px 18px; }
  .register-page .register-panel > h1 { font-size:27px; }
  .register-page .register-panel .auth-intro { margin:7px 0 14px; line-height:1.45; }
  .register-page .register-panel md-input-container { height:62px; min-height:62px; margin-bottom:9px; padding:0; }
  .register-page .register-panel md-input-container .md-input,.register-page .register-panel md-input-container input { min-height:42px; height:42px; line-height:42px; }
  .register-page .register-panel .tos-line { margin-top:1px; margin-bottom:11px; }
  .register-page .register-panel .login-button { min-height:44px; height:44px; }
  .register-page .register-panel .backtologin { min-height:40px; height:40px; }
  .register-page .auth-legal { min-height:42px; }
  .register-ambient-route { min-height:100%; opacity:.61; }
}
@media (prefers-reduced-motion:reduce) { .register-page .auth-canvas::after,.register-ambient-route,.register-ambient-point { animation:none; } }

/* Sign-in is the returning half of the same visual route: the surface does
   not change when the form starts. */
.auth-shell:not(.register-page) .auth-canvas { isolation:isolate; }
.auth-shell:not(.register-page) .auth-panel { border:0; background:transparent; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
.auth-shell:not(.register-page) .auth-legal { border-top:0; background:transparent; }
.login-ambient-route { position:absolute; z-index:0; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; opacity:.54; transform:translate3d(0,0,0); animation:login-ambient-drift 21s ease-in-out infinite alternate; }
.login-ambient-base { fill:none; stroke:rgba(160,215,247,.17); stroke-width:1.15; vector-effect:non-scaling-stroke; }
.login-ambient-base-lower { stroke:rgba(158,142,244,.14); }
.login-ambient-point { fill:#d5f5ff; stroke:#8ed3f4; stroke-width:2; vector-effect:non-scaling-stroke; filter:drop-shadow(0 0 6px rgba(123,207,255,.7)); transform-origin:center; animation:login-ambient-pulse 5.8s ease-in-out infinite; }
.login-ambient-point-late { animation-delay:2.9s; }
@keyframes login-ambient-drift { from { transform:translate3d(-.6%,-.3%,0); opacity:.39; } to { transform:translate3d(.6%,.3%,0); opacity:.56; } }
@keyframes login-ambient-pulse { 0%,100% { opacity:.34; transform:scale(.72); } 48% { opacity:.95; transform:scale(1.25); } }
@media (prefers-reduced-motion:reduce) { .login-ambient-route,.login-ambient-point { animation:none; } }

/* Private inbox: a quiet connection field.  The signal belongs to the inbox
   itself, so individual message rows can stay compact and easy to scan. */
.notification .inbox-private-hero {
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 68px;
  gap:12px;
  align-items:center;
  min-height:96px;
  margin:5px 13px 7px;
  padding:15px 14px 14px;
  overflow:hidden;
  border:1px solid rgba(183,215,255,.12);
  border-radius:20px;
  background:linear-gradient(118deg,rgba(66,99,155,.22),rgba(29,35,60,.50) 61%,rgba(67,48,113,.17));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 15px 32px rgba(1,8,25,.14);
}
.notification .inbox-private-hero::before {
  content:'';
  position:absolute;
  top:13px;
  right:-36px;
  width:126px;
  height:126px;
  border:1px solid rgba(159,211,255,.17);
  border-radius:50%;
  box-shadow:0 0 0 19px rgba(132,178,255,.035),0 0 35px rgba(99,164,245,.09);
  pointer-events:none;
}
.notification .inbox-private-hero::after {
  content:'';
  position:absolute;
  right:28px;
  bottom:15px;
  width:44px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(169,225,255,.76),transparent);
  box-shadow:0 0 12px rgba(108,199,255,.42);
  transform-origin:right center;
  animation:lup-inbox-hero-route 7.5s ease-in-out infinite;
  pointer-events:none;
}
.notification .inbox-private-hero-copy { position:relative; z-index:1; min-width:0; }
.notification .inbox-private-hero-copy > span { display:block; color:#9cd9ff; font-size:8px; font-weight:850; letter-spacing:.15em; line-height:1.1; }
.notification .inbox-private-hero-copy h2 { margin:5px 0 4px; overflow:hidden; color:#f1f6ff; font-size:19px; font-weight:780; letter-spacing:-.025em; line-height:1.08; text-overflow:ellipsis; white-space:nowrap; }
.notification .inbox-private-hero-copy p { margin:0; max-width:250px; color:#afbdd2; font-size:10px; line-height:1.38; }
.notification .inbox-private-signal { position:relative; z-index:1; display:grid; place-items:center; width:54px; height:54px; justify-self:end; border:1px solid rgba(194,230,255,.29); border-radius:50% 50% 50% 13px; background:radial-gradient(circle at 34% 27%,rgba(255,255,255,.29),transparent 23%),linear-gradient(145deg,rgba(87,183,238,.34),rgba(110,80,193,.25)); box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 9px 19px rgba(4,18,52,.26),0 0 22px rgba(111,190,255,.10); color:#e7f7ff; transform:rotate(-45deg); }
.notification .inbox-private-signal .material-icons { font-size:25px; transform:rotate(45deg); text-shadow:0 2px 10px rgba(48,132,207,.48); }
.notification .inbox-private-signal b,.notification .inbox-private-signal em { position:absolute; display:block; border:1px solid rgba(161,220,255,.26); border-radius:50%; pointer-events:none; }
.notification .inbox-private-signal b { width:67px; height:67px; animation:lup-inbox-hero-pulse 4.4s ease-out infinite; }
.notification .inbox-private-signal em { width:86px; height:86px; opacity:0; animation:lup-inbox-hero-pulse 4.4s ease-out 2.15s infinite; }
.notification .notification-panel .inbox-message-list { padding-bottom:27px; }
.notification .notification-panel .inbox-message-list .inbox-thread-card { border-right-color:rgba(174,204,247,.09); border-left-color:rgba(174,204,247,.09); background:linear-gradient(105deg,rgba(69,94,149,.16),rgba(19,27,46,.35) 72%); }
.notification .notification-panel .inbox-message-list .inbox-thread-card:hover,.notification .notification-panel .inbox-message-list .inbox-thread-card:focus-within { background:linear-gradient(105deg,rgba(76,123,188,.27),rgba(27,38,65,.52) 72%); }
@keyframes lup-inbox-hero-route { 0%,100% { opacity:.12; transform:scaleX(.30); } 44% { opacity:.78; transform:scaleX(1); } 62% { opacity:.22; transform:scaleX(.63); } }
@keyframes lup-inbox-hero-pulse { 0% { opacity:.58; transform:scale(.48); } 72%,100% { opacity:0; transform:scale(1); } }
@media (max-width:360px) { .notification .inbox-private-hero { grid-template-columns:minmax(0,1fr) 57px; min-height:90px; margin-right:10px; margin-left:10px; padding:13px 11px; }.notification .inbox-private-hero-copy h2 { font-size:17px; }.notification .inbox-private-signal { width:47px; height:47px; }.notification .inbox-private-signal .material-icons { font-size:22px; } }
@media (prefers-reduced-motion:reduce) { .notification .inbox-private-hero::after,.notification .inbox-private-signal b,.notification .inbox-private-signal em { animation:none; } .notification .inbox-private-signal b { opacity:.18; transform:scale(.72); } .notification .inbox-private-signal em { display:none; } }

/* Active private conversation: a brighter shared field with one slow route
   signal.  The contact stays compact so the message history owns the screen. */
.query-page > md-content { position:relative; isolation:isolate; overflow:hidden; background:radial-gradient(ellipse at 91% 4%,rgba(104,183,242,.20),transparent 31%),radial-gradient(ellipse at 6% 91%,rgba(142,95,207,.15),transparent 39%),linear-gradient(160deg,#13223a 0%,#111b2d 48%,#14172b 100%); }
.query-page > md-content > :not(.query-ambient-map) { position:relative; z-index:1; }
.query-ambient-map { position:absolute; z-index:0; inset:0; overflow:hidden; pointer-events:none; }
.query-ambient-map::before,.query-ambient-map::after { content:''; position:absolute; border:1px solid rgba(160,217,255,.10); border-radius:50%; pointer-events:none; }.query-ambient-map::before { top:17%; right:-42%; width:112%; height:31%; transform:rotate(-24deg); }.query-ambient-map::after { bottom:6%; left:-45%; width:105%; height:28%; border-color:rgba(191,151,255,.085); transform:rotate(18deg); }
.query-route { position:absolute; display:block; width:77%; height:31%; border:1px solid rgba(159,211,255,.09); border-radius:50%; }.query-route-one { top:29%; right:-33%; transform:rotate(-28deg); }.query-route-two { bottom:11%; left:-40%; border-color:rgba(191,151,255,.075); transform:rotate(20deg); }.query-route-light { position:absolute; top:34%; right:11%; width:6px; height:6px; border-radius:50%; background:#d2f2ff; box-shadow:0 0 0 5px rgba(107,191,250,.07),0 0 18px rgba(104,204,255,.78); animation:lup-query-route-light 16s ease-in-out infinite; }.query-map-node { position:absolute; width:4px; height:4px; border-radius:50%; background:rgba(203,231,255,.68); box-shadow:0 0 11px rgba(118,198,255,.45); }.query-map-node-one { top:48%; right:26%; opacity:.37; }.query-map-node-two { bottom:20%; left:18%; background:rgba(208,176,255,.58); opacity:.32; }
.query-page .lup-top-bar { min-height:59px; border-bottom:1px solid rgba(190,219,255,.13); background:linear-gradient(104deg,rgba(19,40,67,.97),rgba(27,31,56,.94)); box-shadow:0 8px 22px rgba(2,10,28,.17); }.query-page .lup-top-bar .md-toolbar-tools { min-height:59px; gap:2px; }.query-page .lup-top-bar > .md-toolbar-tools > .material-icons { color:#b9e5ff; }.query-page .lup-top-bar .md-icon-button { margin:0 2px; color:#c4e5ff; }
.query-page .query-contact { display:flex; align-items:center; min-width:0; gap:9px; margin-left:4px; }.query-page .query-contact .lup-title-avatar,.query-page .query-contact .lup-title-avatar .avatar,.query-page .query-contact .lup-title-avatar img { width:34px; height:34px; }.query-page .query-contact .lup-title-avatar { flex:0 0 34px; margin:0; overflow:hidden; border:1px solid rgba(189,231,255,.34); box-shadow:0 0 0 3px rgba(93,178,238,.08),0 5px 13px rgba(1,11,30,.22); cursor:pointer; }.query-page .query-contact-copy { min-width:0; }.query-page .query-contact-copy > span { display:block; overflow:hidden; color:#93d9ff; font-size:8px; font-weight:850; letter-spacing:.13em; line-height:1.05; text-overflow:ellipsis; white-space:nowrap; }.query-page .query-contact-copy h2 { max-width:min(42vw,230px); margin:3px 0 0; overflow:hidden; color:#f0f7ff; font-size:14px; font-weight:770; letter-spacing:-.01em; line-height:1.12; text-overflow:ellipsis; white-space:nowrap; }
.query-page .chat-msgs { position:relative; padding:4px 0 12px; background:linear-gradient(180deg,rgba(18,35,58,.17),rgba(13,20,36,.34) 75%,rgba(13,20,36,.15)); }.query-page .chat-msgs::before { content:'GESPRÄCHSVERLAUF'; display:block; margin:12px 14px 4px; color:rgba(184,220,251,.53); font-size:8px; font-weight:850; letter-spacing:.14em; }.query-page .chat-msgs .lup-msg { position:relative; border-bottom:0; }.query-page .query-message-card { min-height:64px; margin:0 8px; padding:10px 7px; border-radius:15px; transition:background 180ms ease,transform 180ms ease; }.query-page .query-message-card:hover { background:rgba(149,196,249,.055); }.query-page .query-message-card::before { content:''; position:absolute; top:19px; bottom:19px; left:0; width:1px; background:linear-gradient(180deg,transparent,rgba(155,214,255,.28),transparent); opacity:0; transition:opacity 180ms ease; }.query-page .lup-msg:hover .query-message-card::before { opacity:1; }.query-page .query-message-avatar { border-color:rgba(179,225,255,.30); box-shadow:0 0 0 3px rgba(103,188,242,.06),0 5px 14px rgba(0,0,0,.17); }.query-page .query-message-meta .name { color:#edf7ff; font-size:11px; }.query-page .query-message-meta .time { color:#9db6ce; }.query-page .query-message-content .message { color:#d5e4f4; font-size:12px; line-height:1.48; }.query-page .query-message-content .message::after { background:linear-gradient(90deg,rgba(146,209,255,.30),rgba(146,209,255,0)); }.query-page .lup-own-msg .query-message-card { background:linear-gradient(100deg,rgba(86,137,203,.08),rgba(139,92,190,.07)); }.query-page .lup-own-msg .query-message-card:hover { background:linear-gradient(100deg,rgba(86,137,203,.15),rgba(139,92,190,.12)); }.query-page .lup-own-msg .query-message-content .message { color:#e8efff; }.query-page .lup-own-msg .query-message-content .message::after { background:linear-gradient(90deg,rgba(158,206,255,0),rgba(158,206,255,.32)); }
.query-page .chatbottom { gap:9px; min-height:70px; height:70px; padding:10px 12px max(10px,env(safe-area-inset-bottom)); border-top:1px solid rgba(181,217,251,.14); background:linear-gradient(180deg,rgba(20,37,61,.82),rgba(16,25,43,.97)); box-shadow:0 -11px 25px rgba(3,10,27,.12); }.query-page .chatbottom .chat-input { border:1px solid rgba(187,218,250,.16); border-radius:15px; background:rgba(203,227,255,.075); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }.query-page .chatbottom input { height:43px; padding:0 13px; border:0; border-radius:15px; background:transparent; color:#f4f8ff; font-size:12px; }.query-page .chatbottom input:focus { border:0; box-shadow:0 0 0 2px rgba(121,203,245,.17); }.query-page .chatbottom input::placeholder { color:#abc0d7; }.query-page .chatbottom .chat-button { flex:0 0 43px; width:43px; height:43px; border:1px solid rgba(175,224,255,.28); border-radius:15px; background:linear-gradient(145deg,rgba(87,166,222,.27),rgba(118,86,194,.19)); box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 6px 14px rgba(1,11,31,.16); }.query-page .chatbottom .chat-button:has(button.sendmessage) { border-color:rgba(211,240,255,.48); background:linear-gradient(145deg,rgba(96,190,238,.64),rgba(112,87,203,.57)); box-shadow:inset 0 1px 0 rgba(255,255,255,.33),0 7px 18px rgba(31,111,181,.20),0 0 17px rgba(104,193,255,.16); }.query-page .chatbottom .chat-button button,.query-page .chatbottom .chat-button button.sendmessage { width:20px; min-width:20px; height:20px; background-color:#e5f7ff; }
@keyframes lup-query-route-light { 0%,100% { transform:translate3d(0,0,0); opacity:.18; } 47%,53% { transform:translate3d(-76px,30px,0); opacity:.73; } }
@media (max-width:360px) { .query-page .query-contact { gap:7px; margin-left:1px; }.query-page .query-contact .lup-title-avatar,.query-page .query-contact .lup-title-avatar .avatar,.query-page .query-contact .lup-title-avatar img { width:30px; height:30px; }.query-page .query-contact .lup-title-avatar { flex-basis:30px; }.query-page .query-contact-copy h2 { max-width:34vw; font-size:13px; }.query-page .chatbottom { min-height:65px; height:65px; padding-right:9px; padding-left:9px; }.query-page .chatbottom input { height:39px; }.query-page .chatbottom .chat-button { flex-basis:39px; width:39px; height:39px; } }
@media (prefers-reduced-motion:reduce) { .query-route-light { animation:none; } }

/* Read messages should remain present without competing with the next thing to
   read.  An unread message is deliberately crisp, using the conversation blue
   instead of the old muddy gold highlight. */
.location-chat-surface .lup-msg,
.query-page .chat-msgs .lup-msg {
  opacity:.87;
  transition:opacity 180ms ease;
}
.location-chat-surface .lup-msg.lup-notification-unread,
.query-page .chat-msgs .lup-msg.lup-notification-unread {
  opacity:1;
}
.location-chat-surface .lup-msg.lup-notification-unread .message {
  background:linear-gradient(112deg,rgba(79,154,213,.22),rgba(100,86,187,.15));
  box-shadow:inset 2px 0 0 rgba(143,215,255,.72);
}
.query-page .lup-msg.lup-notification-unread .query-message-card {
  background:linear-gradient(105deg,rgba(78,151,211,.17),rgba(123,94,190,.12));
}

/* The location join control is an open doorway, not a generic primary CTA.
   It uses the current place accent, but keeps the surrounding card quiet. */
.nearby .chatbutton:not(.chatbutton--locked) { width:min(88%,342px); margin:13px auto 0; }
.nearby .chatbutton:not(.chatbutton--locked) button {
  position:relative;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) 16px;
  gap:10px;
  align-items:center;
  width:100%;
  min-height:56px;
  height:56px;
  margin:0;
  padding:7px 13px;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--lup-place-accent) 42%,rgba(216,236,255,.28));
  border-radius:17px;
  background:linear-gradient(110deg,color-mix(in srgb,var(--lup-place-accent) 25%,rgba(39,53,85,.92)),rgba(24,31,52,.88) 58%,color-mix(in srgb,var(--lup-place-accent) 16%,rgba(40,34,72,.85)));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 10px 24px rgba(3,10,29,.18),0 0 20px color-mix(in srgb,var(--lup-place-glow) 22%,transparent);
  color:#f0f7ff;
  font:inherit;
  letter-spacing:0;
  text-shadow:none;
  transition:transform 180ms ease,border-color 180ms ease,background 180ms ease,box-shadow 180ms ease;
}
.nearby .chatbutton:not(.chatbutton--locked) button::before { display:none; content:none; }
.nearby .chatbutton:not(.chatbutton--locked) button::after { content:''; position:absolute; top:0; right:auto; bottom:0; left:0; width:2px; height:auto; border:0; border-radius:0 2px 2px 0; background:color-mix(in srgb,var(--lup-place-accent) 84%,#d6f5ff); box-shadow:0 0 15px var(--lup-place-glow); transform:none; }
.nearby .chatbutton:not(.chatbutton--locked) .chat-enter-mark { position:relative; z-index:1; display:grid; place-items:center; width:38px; height:38px; border:1px solid color-mix(in srgb,var(--lup-place-accent) 44%,rgba(221,241,255,.28)); border-radius:13px 13px 13px 5px; background:color-mix(in srgb,var(--lup-place-accent) 16%,rgba(188,223,255,.08)); box-shadow:inset 0 1px 0 rgba(255,255,255,.16); color:#dff5ff; }.nearby .chatbutton:not(.chatbutton--locked) .chat-enter-mark .material-icons { font-size:21px; filter:drop-shadow(0 2px 7px color-mix(in srgb,var(--lup-place-accent) 70%,transparent)); }
.nearby .chatbutton:not(.chatbutton--locked) .chat-enter-copy { position:relative; z-index:1; display:block; min-width:0; text-align:left; }.nearby .chatbutton:not(.chatbutton--locked) .chat-enter-copy b,.nearby .chatbutton:not(.chatbutton--locked) .chat-enter-copy small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.nearby .chatbutton:not(.chatbutton--locked) .chat-enter-copy b { color:#f3f8ff; font-size:13px; font-weight:820; line-height:1.18; }.nearby .chatbutton:not(.chatbutton--locked) .chat-enter-copy small { margin-top:3px; color:#abc2d8; font-size:9px; font-weight:680; line-height:1; }.nearby .chatbutton:not(.chatbutton--locked) .chat-enter-status { position:relative; z-index:1; display:block; width:7px; height:7px; justify-self:end; border:1px solid rgba(228,255,241,.72); border-radius:50%; background:#9ce7bd; box-shadow:0 0 0 4px rgba(123,232,170,.10),0 0 12px rgba(119,231,169,.78); animation:lup-chat-entry-ready 3.8s ease-in-out infinite; }
.nearby .chatbutton:not(.chatbutton--locked) button:hover,.nearby .chatbutton:not(.chatbutton--locked) button:focus-visible { border-color:color-mix(in srgb,var(--lup-place-accent) 72%,rgba(225,242,255,.48)); background:linear-gradient(110deg,color-mix(in srgb,var(--lup-place-accent) 32%,rgba(44,61,96,.95)),rgba(29,39,65,.93) 58%,color-mix(in srgb,var(--lup-place-accent) 22%,rgba(47,39,83,.89))); box-shadow:inset 0 1px 0 rgba(255,255,255,.21),0 13px 27px rgba(3,10,29,.23),0 0 26px color-mix(in srgb,var(--lup-place-glow) 34%,transparent); filter:none; outline:0; transform:translateY(-1px); }.nearby .chatbutton:not(.chatbutton--locked) button:active { transform:translateY(1px); }
@keyframes lup-chat-entry-ready { 0%,100% { opacity:.54; box-shadow:0 0 0 3px rgba(123,232,170,.07),0 0 9px rgba(119,231,169,.42); } 48% { opacity:1; box-shadow:0 0 0 5px rgba(123,232,170,.13),0 0 15px rgba(119,231,169,.84); } }
@media (max-width:360px) { .nearby .chatbutton:not(.chatbutton--locked) { width:min(91%,330px); }.nearby .chatbutton:not(.chatbutton--locked) button { grid-template-columns:34px minmax(0,1fr) 13px; gap:8px; min-height:52px; height:52px; padding-right:10px; padding-left:10px; }.nearby .chatbutton:not(.chatbutton--locked) .chat-enter-mark { width:34px; height:34px; border-radius:11px 11px 11px 4px; }.nearby .chatbutton:not(.chatbutton--locked) .chat-enter-mark .material-icons { font-size:19px; }.nearby .chatbutton:not(.chatbutton--locked) .chat-enter-copy b { font-size:12px; }.nearby .chatbutton:not(.chatbutton--locked) .chat-enter-copy small { font-size:8px; } }
@media (prefers-reduced-motion:reduce) { .nearby .chatbutton:not(.chatbutton--locked) .chat-enter-status { animation:none; } }

/* About is a profile card, not an account settings form.  The person gets one
   calm story surface, followed by compact facts grouped by meaning. */
.profile-page .profile-information.profile-about-single { width:min(100%,680px); margin:0 auto; padding:14px 16px 9px; background:transparent; }
.profile-page .profile-information.profile-about-single .profile-story-card { min-height:0; margin:0; padding:16px 2px 18px; border:0; border-radius:0; background:transparent; box-shadow:none; }.profile-page .profile-information.profile-about-single .profile-story-card::before,.profile-page .profile-information.profile-about-single .profile-story-card::after { display:none; content:none; }.profile-page .profile-information.profile-about-single .profile-story-card .md-list-item-text { min-height:0; margin:0; padding:0; border:0; background:transparent; box-shadow:none; }
.profile-page .profile-about-kicker { display:flex; align-items:center; gap:7px; margin:0 0 10px; color:#a9d9ff; font-size:8px; font-weight:850; letter-spacing:.15em; line-height:1; }.profile-page .profile-about-kicker .material-icons { display:grid; place-items:center; width:23px; height:23px; border:1px solid rgba(171,222,255,.23); border-radius:8px 8px 8px 3px; background:rgba(99,170,230,.12); color:#c5ecff; font-size:14px; }.profile-page .profile-information.profile-about-single .profile-about-me { max-width:570px; margin:0; color:#e5edf8; font-size:15px; font-weight:470; line-height:1.65; text-shadow:none; }.profile-page .profile-information.profile-about-single .profile-about-empty { margin:8px 0 0; color:#aab9ce; font-size:13px; font-style:normal; }
.profile-page .profile-information.profile-settings-view { display:block; width:min(100%,680px); margin:0 auto; padding:9px 16px 30px; background:transparent; }.profile-page .profile-information.profile-settings-view .profile-settings-group { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px 9px; margin:0 0 19px; }.profile-page .profile-information.profile-settings-view .profile-settings-group > .md-subheader { grid-column:1 / -1; min-height:24px; margin:0; padding:4px 1px 6px; border:0; background:transparent; color:#a8bbd2; font-size:8px; font-weight:850; letter-spacing:.14em; line-height:1.1; text-transform:uppercase; }
.profile-page .profile-information.profile-settings-view .profile-detail-card { display:grid; grid-template-columns:30px minmax(0,1fr); gap:8px; align-items:start; min-width:0; min-height:69px; height:auto; margin:0; padding:10px 9px; overflow:hidden; border:1px solid rgba(192,215,246,.10); border-radius:14px; background:rgba(31,40,61,.36); box-shadow:inset 0 1px 0 rgba(255,255,255,.045); }.profile-page .profile-information.profile-settings-view .profile-detail-card::after { display:none; content:none; }.profile-page .profile-information.profile-settings-view .profile-detail-card:nth-of-type(3n) { background:rgba(45,58,86,.31); }.profile-page .profile-information.profile-settings-view .profile-detail-card .profile-detail-icon { display:grid; place-items:center; width:30px; height:30px; margin:0; border:1px solid rgba(174,220,255,.17); border-radius:10px 10px 10px 4px; background:rgba(100,169,228,.10); color:#bce9ff; }.profile-page .profile-information.profile-settings-view .profile-detail-card .profile-detail-icon .material-icons { font-size:16px; }.profile-page .profile-information.profile-settings-view .profile-detail-card .md-list-item-text { min-width:0; min-height:0; margin:0; padding:0; border:0; background:transparent; box-shadow:none; }.profile-page .profile-information.profile-settings-view .profile-detail-card h3 { overflow:hidden; margin:0 0 4px; color:#9fb2c9; font-size:8px; font-weight:820; letter-spacing:.075em; line-height:1.15; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; }.profile-page .profile-information.profile-settings-view .profile-detail-card h3::after { display:none; content:none; }.profile-page .profile-information.profile-settings-view .profile-detail-card p { display:-webkit-box; overflow:hidden; margin:0; color:#eaf2ff; font-size:11px; font-weight:650; line-height:1.32; text-overflow:ellipsis; -webkit-box-orient:vertical; -webkit-line-clamp:2; }.profile-page .profile-information.profile-settings-view .profile-detail-card p .material-icons { margin-right:3px; color:#f0b5c5; font-size:13px; vertical-align:-2px; }.profile-page .profile-information.profile-settings-view .profile-detail-card.profile-setting-denied { border-color:rgba(233,163,188,.14); background:rgba(92,48,67,.18); }
@media (max-width:360px) { .profile-page .profile-information.profile-about-single,.profile-page .profile-information.profile-settings-view { padding-right:11px; padding-left:11px; }.profile-page .profile-information.profile-settings-view .profile-settings-group { gap:7px; }.profile-page .profile-information.profile-settings-view .profile-detail-card { grid-template-columns:27px minmax(0,1fr); gap:7px; min-height:65px; padding:9px 8px; }.profile-page .profile-information.profile-settings-view .profile-detail-card .profile-detail-icon { width:27px; height:27px; border-radius:9px 9px 9px 3px; }.profile-page .profile-information.profile-settings-view .profile-detail-card .profile-detail-icon .material-icons { font-size:15px; }.profile-page .profile-information.profile-settings-view .profile-detail-card p { font-size:10px; } }

/* LinkUUp signature for the about view: one location route crosses the
   personal story, then resolves into the same calm, readable facts below. */
.profile-page .profile-information.profile-about-single .profile-story-card { position:relative; overflow:hidden; }.profile-page .profile-information.profile-about-single .profile-story-card::before { display:block; content:''; position:absolute; top:-45px; right:-52px; width:184px; height:132px; border:1px solid rgba(155,214,255,.10); border-radius:50%; background:radial-gradient(circle at 52% 56%,rgba(107,177,242,.09),transparent 42%); box-shadow:0 0 0 22px rgba(118,162,255,.025),0 0 42px rgba(84,181,244,.07); transform:rotate(-18deg); }.profile-page .profile-information.profile-about-single .profile-story-card::after { display:block; content:''; position:absolute; top:49px; right:0; width:104px; height:1px; border:0; border-radius:0; background:linear-gradient(90deg,transparent,rgba(154,219,255,.30),transparent); box-shadow:0 0 13px rgba(104,191,251,.18); transform:rotate(-19deg); }
.profile-page .profile-about-kicker,.profile-page .profile-about-me,.profile-page .profile-about-empty { position:relative; z-index:2; }.profile-page .profile-about-route { position:absolute; z-index:1; top:17px; right:15px; width:84px; height:72px; color:#a9e5ff; opacity:.58; pointer-events:none; }.profile-page .profile-about-route > span { position:absolute; top:31px; left:2px; width:76px; height:1px; background:linear-gradient(90deg,transparent,rgba(150,218,255,.65),transparent); box-shadow:0 0 12px rgba(105,197,255,.43); transform:rotate(-25deg); }.profile-page .profile-about-route > b,.profile-page .profile-about-route > em { position:absolute; display:block; width:4px; height:4px; border-radius:50%; background:#d8f7ff; box-shadow:0 0 10px rgba(125,210,255,.85); }.profile-page .profile-about-route > b { top:38px; left:17px; }.profile-page .profile-about-route > em { top:11px; right:8px; animation:lup-profile-about-route 8.5s ease-in-out infinite; }.profile-page .profile-about-route .material-icons { position:absolute; top:17px; right:18px; color:#c8f0ff; font-size:20px; filter:drop-shadow(0 3px 8px rgba(78,178,245,.47)); transform:rotate(-1deg); }
.profile-page .profile-information.profile-settings-view .profile-settings-group > .md-subheader { position:relative; padding-left:12px; }.profile-page .profile-information.profile-settings-view .profile-settings-group > .md-subheader::before { content:''; position:absolute; top:50%; left:1px; width:4px; height:4px; border-radius:50%; background:#a5e1ff; box-shadow:0 0 9px rgba(123,204,255,.66); transform:translateY(-50%); }.profile-page .profile-information.profile-settings-view .profile-detail-card { transition:transform 180ms ease,border-color 180ms ease,background 180ms ease,box-shadow 180ms ease; }.profile-page .profile-information.profile-settings-view .profile-detail-card:hover { border-color:rgba(170,220,255,.24); background:linear-gradient(135deg,rgba(80,136,202,.17),rgba(43,48,79,.34)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 9px 19px rgba(2,9,28,.13); transform:translateY(-1px); }.profile-page .profile-information.profile-settings-view .profile-detail-card:nth-of-type(3n) .profile-detail-icon { border-color:rgba(207,178,255,.19); background:rgba(145,112,218,.11); color:#dfceff; }.profile-page .profile-information.profile-settings-view .profile-detail-card:nth-of-type(4n) .profile-detail-icon { border-color:rgba(245,210,141,.17); background:rgba(218,168,78,.10); color:#ffe0a0; }
@keyframes lup-profile-about-route { 0%,100% { opacity:.25; transform:translate3d(0,0,0) scale(.7); } 46%,54% { opacity:1; transform:translate3d(-43px,20px,0) scale(1.22); } }
@media (max-width:360px) { .profile-page .profile-about-route { top:12px; right:6px; opacity:.42; transform:scale(.82); transform-origin:top right; }.profile-page .profile-information.profile-about-single .profile-about-me { padding-right:5px; } }
@media (prefers-reduced-motion:reduce) { .profile-page .profile-about-route > em { animation:none; opacity:.55; } .profile-page .profile-information.profile-settings-view .profile-detail-card { transition:none; } }

/* Profile facts and account settings share the same promise: every control
   says what it changes.  Keep them compact enough for a phone, but never
   squeeze a label into an anonymous or truncated chip. */
.profile-page .profile-information.profile-settings-view .profile-detail-card h3 {
  display:-webkit-box;
  overflow:hidden;
  white-space:normal;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.profile-page .profile-information.profile-settings-view .profile-detail-card {
  align-content:start;
}
.lup-settings-list .lup-settings-group {
  margin:0 0 21px;
}
.lup-settings-list .lup-settings-group-heading .md-subheader {
  display:flex;
  flex-direction:column;
  gap:4px;
  margin:14px 4px 8px;
}
.lup-settings-list .lup-settings-group-heading .md-subheader b {
  color:#dbeeff;
  font-size:10px;
  font-weight:850;
  letter-spacing:.11em;
}
.lup-settings-list .lup-settings-group-heading .md-subheader small {
  color:#91a8c2;
  font-size:11px;
  font-weight:520;
  letter-spacing:0;
  line-height:1.35;
  text-transform:none;
}
.lup-settings-list md-list-item.md-2-line {
  min-height:72px;
  margin:6px 0;
  padding:8px 12px;
  border-color:rgba(181,212,245,.12);
  border-radius:14px;
  background:linear-gradient(115deg,rgba(62,91,139,.18),rgba(22,31,50,.42));
}
.lup-settings-list .md-list-item-text {
  min-width:0;
}
.lup-settings-list .md-list-item-text h3 {
  overflow:visible;
  margin:0;
  color:#edf6ff;
  font-size:13px;
  font-weight:760;
  line-height:1.25;
  white-space:normal;
}
.lup-settings-list .lup-setting-controls {
  flex:0 1 52%;
}
.lup-settings-list .lup-setting-controls > md-select,
.lup-settings-list .lup-setting-controls > .lup-setting-input {
  max-width:min(48vw,310px);
}
.lup-settings-list .lup-setting-textarea {
  min-height:151px;
}
.lup-settings-list .lup-setting-textarea .md-list-item-text {
  margin-bottom:10px;
}
.lup-settings-list .lup-setting-input input,
.lup-settings-list .lup-setting-input textarea {
  border-color:rgba(161,207,245,.14);
  border-radius:10px;
  background:rgba(10,18,33,.42);
}
@media (max-width:360px) {
  .lup-settings-list md-list-item.md-2-line { padding:8px 10px; }
  .lup-settings-list .md-list-item-text h3 { font-size:12px; }
  .lup-settings-list .lup-setting-controls { flex-basis:49%; gap:5px; }
}

/* Settings are a control room, not a stack of anonymous form rows. Each
   decision gets one calm surface: its name, its value, then (where relevant)
   its visibility. This deliberately removes the old nested Material list
   wrappers that intercepted taps on narrow screens. */
.settings-page .lup-settings-list { width:min(100%,720px); margin:0 auto; padding:15px 14px 42px; }
.settings-page .lup-settings-profile-visibility { display:grid; grid-template-columns:minmax(0,1fr) minmax(126px,42%); gap:12px; align-items:center; margin:13px 0 24px; padding:14px; border:1px solid rgba(166,215,253,.16); border-radius:17px; background:linear-gradient(120deg,rgba(71,128,183,.20),rgba(24,31,52,.50)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }
.settings-page .lup-profile-visibility-choice { position:relative; min-width:0; }.settings-page .lup-profile-visibility-choice .lup-visibility-menu { bottom:auto; top:calc(100% + 6px); }
.settings-page .settings-visibility-heading { display:flex; gap:10px; align-items:center; min-width:0; }
.settings-page .settings-visibility-heading > .material-icons { display:grid; place-items:center; flex:0 0 32px; width:32px; height:32px; border:1px solid rgba(180,230,255,.20); border-radius:10px 10px 10px 4px; background:rgba(102,184,238,.12); color:#c6eeff; font-size:17px; }
.settings-page .settings-visibility-heading strong,.settings-page .settings-visibility-heading small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.settings-page .settings-visibility-heading strong { color:#edf6ff; font-size:12px; font-weight:780; }.settings-page .settings-visibility-heading small { margin-top:3px; color:#9bb0c9; font-size:10px; }
.settings-page .lup-settings-profile-visibility > md-select,.settings-page .lup-setting-primary-select { min-width:0; width:100%; margin:0; padding:7px 8px 4px; border:1px solid rgba(188,222,249,.17); border-radius:10px; background:rgba(9,17,32,.34); color:#f1f7ff; }
.settings-page .lup-settings-group { margin:0 0 27px; }.settings-page .lup-settings-group-heading { display:flex; gap:8px; align-items:baseline; margin:0 3px 9px; padding:0; }.settings-page .lup-settings-group-heading small { color:#b4ddf7; font-size:9px; font-weight:850; letter-spacing:.14em; text-transform:uppercase; }.settings-page .lup-settings-group-heading p { overflow:hidden; margin:0; color:#8fa4bd; font-size:10px; line-height:1.3; text-overflow:ellipsis; white-space:nowrap; }
.settings-page .lup-setting-card { display:grid; grid-template-columns:minmax(0,1fr) minmax(128px,42%); gap:10px 13px; align-items:center; margin:7px 0; padding:12px 13px; border:1px solid rgba(183,213,245,.11); border-radius:15px; background:linear-gradient(112deg,rgba(57,83,128,.17),rgba(17,25,43,.48)); box-shadow:inset 0 1px 0 rgba(255,255,255,.055); transition:border-color .18s ease,background .18s ease,transform .18s ease; }.settings-page .lup-setting-card:hover,.settings-page .lup-setting-card:focus-within { border-color:rgba(141,210,249,.30); background:linear-gradient(112deg,rgba(69,113,168,.27),rgba(24,31,53,.58)); transform:translateY(-1px); }
.settings-page .lup-setting-card-heading { display:flex; gap:9px; align-items:center; min-width:0; }.settings-page .lup-setting-icon { display:grid; place-items:center; flex:0 0 30px; width:30px; height:30px; border:1px solid rgba(167,218,252,.16); border-radius:9px 9px 9px 3px; background:rgba(89,167,224,.10); color:#c5edff; }.settings-page .lup-setting-icon .material-icons { font-size:16px; }.settings-page .lup-setting-card-heading h3 { overflow:hidden; margin:0; color:#edf5ff; font-size:13px; font-weight:760; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }.settings-page .lup-setting-card-heading p { margin:3px 0 0; color:#91a8c1; font-size:9px; line-height:1.2; }
.settings-page .lup-setting-value { display:flex; align-items:center; justify-content:flex-end; min-width:0; }.settings-page .lup-setting-value > md-select,.settings-page .lup-setting-value .lup-setting-input { min-width:0; width:100%; max-width:none; margin:0; }.settings-page .lup-setting-value md-select { padding:7px 8px 4px; border:1px solid rgba(182,216,244,.15); border-radius:10px; background:rgba(8,16,31,.37); color:#edf6ff; }.settings-page .lup-setting-value .md-select-value { min-width:0; }.settings-page .lup-setting-value .lup-setting-input input,.settings-page .lup-setting-value .lup-setting-input textarea { width:100%; margin:0; padding:7px 8px; border:1px solid rgba(182,216,244,.15); border-radius:10px; background:rgba(8,16,31,.37); color:#edf6ff; }.settings-page .lup-setting-value md-switch { margin:0 5px 0 0; }
.settings-page .lup-setting-visibility { grid-column:1 / -1; display:flex; align-items:center; justify-content:space-between; gap:11px; min-height:27px; padding-top:8px; border-top:1px solid rgba(190,218,245,.08); cursor:default; }.settings-page .lup-setting-visibility > span { display:flex; align-items:center; gap:5px; color:#93a9bf; font-size:9px; font-weight:730; letter-spacing:.04em; text-transform:uppercase; }.settings-page .lup-setting-visibility .material-icons { color:#b2ddf7; font-size:13px; }.settings-page .lup-setting-visibility-choice { position:relative; min-width:128px; }.settings-page .lup-visibility-trigger { display:flex; align-items:center; justify-content:space-between; gap:7px; width:100%; min-height:30px; padding:6px 8px; border:1px solid rgba(155,213,248,.18); border-radius:8px; background:rgba(92,145,190,.10); color:#d8efff; cursor:pointer; font:inherit; }.settings-page .lup-visibility-trigger > span { overflow:hidden; font-size:10px; font-weight:780; text-overflow:ellipsis; white-space:nowrap; }.settings-page .lup-visibility-trigger .material-icons { font-size:15px; }.settings-page .lup-visibility-trigger:disabled { opacity:.55; cursor:default; }.settings-page .lup-visibility-menu { position:absolute; z-index:50; right:0; bottom:calc(100% + 6px); display:grid; width:max-content; min-width:142px; overflow:hidden; border:1px solid rgba(171,221,250,.25); border-radius:10px; background:#18243b; box-shadow:0 14px 30px rgba(1,7,20,.42); }.settings-page .lup-visibility-menu button { min-height:32px; padding:6px 11px; border:0; border-bottom:1px solid rgba(194,220,247,.08); background:transparent; color:#d8e8f8; cursor:pointer; font:600 11px/1.2 inherit; text-align:left; }.settings-page .lup-visibility-menu button:last-child { border-bottom:0; }.settings-page .lup-visibility-menu button:hover,.settings-page .lup-visibility-menu button.is-selected { background:rgba(105,181,229,.17); color:#f5fbff; }.settings-page .lup-visibility-menu button.is-selected::after { content:'✓'; float:right; margin-left:14px; color:#9ce8cf; }.settings-page .lup-visibility-menu button:disabled { opacity:.36; cursor:default; }
.settings-page .lup-setting-card--textarea { grid-template-columns:1fr; }.settings-page .lup-setting-card--textarea .lup-setting-value { justify-content:stretch; }.settings-page .lup-setting-card--textarea .lup-setting-input textarea { min-height:92px; resize:vertical; }
@media (max-width:420px) { .settings-page .lup-settings-list { padding-right:11px; padding-left:11px; }.settings-page .lup-settings-profile-visibility,.settings-page .lup-setting-card { grid-template-columns:1fr; }.settings-page .lup-settings-profile-visibility > md-select { width:100%; }.settings-page .lup-setting-value { justify-content:stretch; }.settings-page .lup-setting-visibility { grid-column:auto; }.settings-page .lup-settings-group-heading { display:block; }.settings-page .lup-settings-group-heading p { margin-top:4px; white-space:normal; } }

/* LinkUUp settings deck — a quiet route through the parts of a profile.
   The motion is deliberately ambient: settings are a place to decide, not a
   place that competes for attention. */
.settings-page > md-content { position:relative; isolation:isolate; overflow-x:hidden; background:radial-gradient(ellipse at 105% 4%,rgba(77,184,240,.13),transparent 28%),radial-gradient(ellipse at -12% 48%,rgba(112,86,204,.11),transparent 34%),linear-gradient(160deg,#101a2c 0%,#101725 48%,#111a2d 100%); }.settings-page > md-content::before,.settings-page > md-content::after { content:''; position:absolute; z-index:0; width:86vw; height:31vh; border:1px solid rgba(135,209,255,.075); border-radius:50%; pointer-events:none; }.settings-page > md-content::before { top:115px; right:-53vw; transform:rotate(-22deg); }.settings-page > md-content::after { bottom:7%; left:-54vw; border-color:rgba(179,145,247,.065); transform:rotate(19deg); }.settings-page > md-content > :not(.lup-top-bar) { position:relative; z-index:1; }
.settings-page .lup-settings-list { max-width:680px; padding-top:9px; }.settings-page .settings-hero { position:relative; display:grid; grid-template-columns:44px minmax(0,1fr); gap:12px; align-items:start; min-height:105px; margin:0 0 16px; padding:17px 15px 15px; overflow:hidden; border:1px solid rgba(169,218,250,.14); border-radius:19px; background:linear-gradient(123deg,rgba(60,124,177,.25),rgba(24,33,55,.66) 58%,rgba(87,65,143,.15)); box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 15px 34px rgba(2,9,28,.18); }.settings-page .settings-hero::before { content:''; position:absolute; top:-90px; right:-78px; width:198px; height:198px; border:1px solid rgba(170,226,255,.16); border-radius:50%; box-shadow:0 0 0 18px rgba(137,198,255,.035),0 0 42px rgba(100,190,250,.08); }.settings-page .settings-hero::after { content:''; position:absolute; right:31px; bottom:20px; width:66px; height:1px; background:linear-gradient(90deg,transparent,rgba(167,226,255,.80),transparent); box-shadow:0 0 13px rgba(117,208,255,.52); animation:lup-settings-route 7s ease-in-out infinite; }.settings-page .settings-hero-route { position:relative; z-index:1; display:grid; place-items:center; width:43px; height:43px; border:1px solid rgba(191,232,255,.28); border-radius:13px 13px 13px 5px; background:linear-gradient(140deg,rgba(111,198,239,.27),rgba(87,88,175,.18)); box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 8px 20px rgba(11,46,81,.20); color:#dcf7ff; }.settings-page .settings-hero-route .material-icons { font-size:22px; filter:drop-shadow(0 2px 7px rgba(105,205,255,.52)); }.settings-page .settings-hero > div { position:relative; z-index:1; min-width:0; }.settings-page .settings-hero small { color:#b5e0fb; font-size:8px; font-weight:860; letter-spacing:.16em; }.settings-page .settings-hero h1 { margin:5px 0 5px; color:#f2f7ff; font-size:22px; font-weight:790; letter-spacing:-.035em; line-height:1.05; }.settings-page .settings-hero p { max-width:370px; margin:0; color:#afc0d6; font-size:11px; line-height:1.42; }
.settings-page .lup-settings-profile-visibility { position:relative; margin-bottom:29px; border-color:rgba(146,213,245,.18); border-radius:15px; background:linear-gradient(110deg,rgba(69,130,177,.19),rgba(19,29,49,.43)); }.settings-page .lup-settings-profile-visibility::before { content:'DEIN PROFIL'; position:absolute; top:-7px; left:13px; padding:0 6px; background:#132039; color:#96cff1; font-size:8px; font-weight:850; letter-spacing:.14em; }
.settings-page .lup-settings-group { position:relative; margin-bottom:30px; padding-left:13px; }.settings-page .lup-settings-group::before { content:''; position:absolute; top:29px; bottom:-18px; left:2px; width:1px; background:linear-gradient(180deg,rgba(127,210,253,.34),rgba(128,155,230,.08),transparent); }.settings-page .lup-settings-group:last-child::before { display:none; }.settings-page .lup-settings-group-heading { position:relative; margin-left:-13px; padding-left:14px; }.settings-page .lup-settings-group-heading::before { content:''; position:absolute; top:5px; left:0; width:5px; height:5px; border-radius:50%; background:#a7e5ff; box-shadow:0 0 12px rgba(112,208,255,.83); }.settings-page .lup-settings-group-heading small { color:#c3e9ff; }.settings-page .lup-setting-card { position:relative; border-color:rgba(170,209,241,.10); border-radius:13px; background:linear-gradient(104deg,rgba(57,88,133,.13),rgba(18,27,46,.39)); box-shadow:inset 0 1px 0 rgba(255,255,255,.035); }.settings-page .lup-setting-card:hover,.settings-page .lup-setting-card:focus-within { border-color:rgba(136,215,255,.35); background:linear-gradient(104deg,rgba(61,116,169,.24),rgba(22,31,53,.56)); box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 9px 20px rgba(1,8,25,.14); }.settings-page .lup-setting-icon { border-color:rgba(164,222,255,.21); background:linear-gradient(140deg,rgba(102,188,233,.19),rgba(105,91,184,.08)); color:#d2f1ff; }.settings-page .lup-setting-card:nth-child(2n) .lup-setting-icon { border-color:rgba(208,183,255,.19); background:rgba(146,111,217,.10); color:#e4d7ff; }.settings-page .lup-setting-card-heading h3 { font-weight:790; }.settings-page .lup-setting-value md-select,.settings-page .lup-setting-value .lup-setting-input input,.settings-page .lup-setting-value .lup-setting-input textarea { border-color:rgba(164,215,246,.18); background:rgba(7,16,31,.32); }.settings-page .lup-visibility-trigger { border-color:rgba(145,222,255,.26); background:linear-gradient(112deg,rgba(82,159,202,.19),rgba(72,79,145,.17)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }.settings-page .lup-visibility-trigger:hover { border-color:rgba(167,231,255,.48); background:linear-gradient(112deg,rgba(93,180,225,.27),rgba(91,89,168,.22)); }.settings-page .lup-visibility-menu { border-color:rgba(150,223,255,.30); background:linear-gradient(150deg,#1b2c49,#19233b); box-shadow:0 17px 39px rgba(1,8,24,.52),inset 0 1px 0 rgba(255,255,255,.09); }
@keyframes lup-settings-route { 0%,100% { opacity:.18; transform:translateX(-17px); } 44% { opacity:1; transform:translateX(18px); } 62% { opacity:.34; transform:translateX(2px); } }
@media (max-width:420px) { .settings-page .settings-hero { min-height:99px; padding:15px 13px; }.settings-page .settings-hero h1 { font-size:20px; }.settings-page .lup-settings-group { padding-left:9px; }.settings-page .lup-settings-group-heading { margin-left:-9px; padding-left:11px; } }
@media (prefers-reduced-motion:reduce) { .settings-page .settings-hero::after { animation:none; opacity:.5; } }

/* Public profile signals. These are facts a person deliberately shares, so
   they read like a compact identity map rather than a settings form. */
.profile-page .profile-information.profile-signal-board { position:relative; display:block; width:min(100%,680px); margin:0 auto; padding:2px 16px 34px; background:transparent; }.profile-page .profile-signal-group { position:relative; margin:0 0 22px; padding:0; }.profile-page .profile-signal-group-heading { display:flex; align-items:center; gap:8px; height:23px; margin:0 0 6px; padding:0 2px; }.profile-page .profile-signal-group-heading > span { width:5px; height:5px; border-radius:50%; background:#9fe6ff; box-shadow:0 0 11px rgba(108,208,255,.85); }.profile-page .profile-signal-group-heading small { color:#a4c0d9; font-size:8px; font-weight:870; letter-spacing:.15em; line-height:1; text-transform:uppercase; }.profile-page .profile-signal-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; overflow:hidden; border:1px solid rgba(173,211,241,.10); border-radius:16px; background:rgba(176,214,244,.08); box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 12px 26px rgba(2,10,29,.10); }.profile-page .profile-signal { position:relative; display:grid; grid-template-columns:34px minmax(0,1fr); gap:9px; align-items:center; min-width:0; min-height:65px; margin:0; padding:10px 10px; overflow:hidden; border:0; border-radius:0; background:linear-gradient(115deg,rgba(52,81,125,.22),rgba(21,30,49,.50)); }.profile-page .profile-signal::after { content:''; position:absolute; right:-22px; bottom:-31px; width:66px; height:66px; border:1px solid rgba(148,218,255,.075); border-radius:50%; pointer-events:none; }.profile-page .profile-signal:nth-child(3n) { background:linear-gradient(115deg,rgba(78,66,134,.20),rgba(23,29,51,.52)); }.profile-page .profile-signal-icon { position:relative; z-index:1; display:grid; place-items:center; width:34px; height:34px; border:1px solid rgba(171,224,255,.20); border-radius:11px 11px 11px 4px; background:linear-gradient(145deg,rgba(108,194,234,.17),rgba(100,90,181,.08)); color:#c9efff; }.profile-page .profile-signal-icon .material-icons { font-size:17px; filter:drop-shadow(0 2px 6px rgba(91,193,255,.28)); }.profile-page .profile-signal-copy { position:relative; z-index:1; min-width:0; }.profile-page .profile-signal-copy small,.profile-page .profile-signal-copy strong { display:block; overflow:hidden; margin:0; text-overflow:ellipsis; white-space:nowrap; }.profile-page .profile-signal-copy small { color:#91aac3; font-size:8px; font-weight:790; letter-spacing:.065em; line-height:1.15; text-transform:uppercase; }.profile-page .profile-signal-copy strong { margin-top:4px; color:#f0f6ff; font-size:12px; font-weight:720; line-height:1.2; }.profile-page .profile-signal-copy strong .material-icons { margin-right:4px; color:#efb2c7; font-size:13px; vertical-align:-2px; }.profile-page .profile-signal--denied { background:rgba(64,42,62,.28); }.profile-page .profile-signal--denied .profile-signal-icon { border-color:rgba(235,176,197,.16); background:rgba(202,102,136,.10); color:#f3c5d3; }
@media (max-width:360px) { .profile-page .profile-information.profile-signal-board { padding-right:11px; padding-left:11px; }.profile-page .profile-signal { grid-template-columns:30px minmax(0,1fr); gap:7px; min-height:60px; padding:8px; }.profile-page .profile-signal-icon { width:30px; height:30px; }.profile-page .profile-signal-copy strong { font-size:11px; } }

/* The wide discovery canvas keeps its calm moving map points.  The separate
   diagonal flash was a leftover visual route and could cross the category
   area on desktop, so it is intentionally retired. */
.nearby md-content.greybg::after {
  content:none;
  display:none;
  animation:none;
  box-shadow:none;
}

/* Profile atlas — a shared profile is a small map of a person, not a pile of
   settings cards. Each category becomes one connected coordinate surface;
   the segmented details make it feel constructed without competing with the
   person's actual words. */
.profile-page .profile-information.profile-signal-board {
  width:min(100%,720px);
  padding:7px 14px 42px;
}
.profile-page .profile-signal-group {
  position:relative;
  margin:0 0 25px;
  padding:0 0 0 14px;
}
.profile-page .profile-signal-group::before {
  content:'';
  position:absolute;
  top:25px;
  bottom:-20px;
  left:2px;
  width:1px;
  background:linear-gradient(180deg,rgba(157,226,255,.46),rgba(144,157,255,.13),transparent);
}
.profile-page .profile-signal-group:last-child::before { display:none; }
.profile-page .profile-signal-group-heading {
  position:relative;
  height:27px;
  margin:0 0 8px -14px;
  padding:0 3px 0 14px;
}
.profile-page .profile-signal-group-heading > span {
  position:absolute;
  top:9px;
  left:0;
  width:6px;
  height:6px;
  border:1px solid rgba(222,247,255,.62);
  background:#aeeaff;
  box-shadow:0 0 0 4px rgba(112,205,255,.08),0 0 14px rgba(111,206,255,.92);
}
.profile-page .profile-signal-group-heading small {
  position:relative;
  padding:5px 9px 5px 0;
  color:#c8eaff;
  font-size:9px;
  font-weight:880;
  letter-spacing:.17em;
}
.profile-page .profile-signal-group-heading small::after {
  content:'';
  position:absolute;
  top:50%;
  left:calc(100% + 2px);
  width:38px;
  height:1px;
  background:linear-gradient(90deg,rgba(161,221,255,.44),transparent);
}
.profile-page .profile-signal-grid {
  position:relative;
  gap:1px;
  overflow:hidden;
  border:1px solid rgba(171,218,250,.17);
  border-radius:21px 21px 21px 7px;
  background:rgba(140,207,246,.14);
  box-shadow:0 16px 34px rgba(1,9,27,.17),inset 0 1px 0 rgba(255,255,255,.08);
}
.profile-page .profile-signal-grid::before {
  content:'';
  position:absolute;
  z-index:2;
  top:0;
  right:7%;
  left:7%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(211,244,255,.58),transparent);
  pointer-events:none;
}
.profile-page .profile-signal {
  grid-template-columns:38px minmax(0,1fr);
  gap:10px;
  min-height:74px;
  padding:12px 12px;
  background:linear-gradient(122deg,rgba(47,79,122,.39),rgba(17,28,49,.72));
  transition:transform 190ms ease,background 190ms ease;
}
.profile-page .profile-signal::before {
  content:'';
  position:absolute;
  top:10px;
  right:11px;
  width:16px;
  height:16px;
  border-top:1px solid rgba(174,226,255,.16);
  border-right:1px solid rgba(174,226,255,.16);
  pointer-events:none;
}
.profile-page .profile-signal::after {
  right:-35px;
  bottom:-45px;
  width:103px;
  height:103px;
  border-color:rgba(142,215,255,.10);
  background:radial-gradient(circle,rgba(109,184,245,.10),transparent 65%);
}
.profile-page .profile-signal:nth-child(3n) {
  background:linear-gradient(122deg,rgba(74,59,124,.38),rgba(25,27,52,.72));
}
.profile-page .profile-signal:nth-child(4n) {
  background:linear-gradient(122deg,rgba(61,90,117,.35),rgba(18,30,48,.72));
}
.profile-page .profile-signal--private {
  background:linear-gradient(122deg,rgba(70,48,89,.36),rgba(24,27,48,.76));
}
.profile-page .profile-signal--private::before {
  border-color:rgba(227,192,255,.22);
}
.profile-page .profile-signal--private .profile-signal-icon {
  border-color:rgba(222,191,255,.27);
  background:linear-gradient(145deg,rgba(153,108,210,.21),rgba(81,69,139,.12));
  color:#e8d9ff;
}
.profile-page .profile-signal--private .profile-signal-copy strong,
.profile-page .profile-signal--private .profile-signal-copy strong .material-icons {
  color:#dec9f6;
}
.profile-page .profile-signal-icon {
  width:38px;
  height:38px;
  border:1px solid rgba(184,232,255,.30);
  border-radius:13px 13px 13px 4px;
  background:linear-gradient(145deg,rgba(113,207,246,.29),rgba(105,100,202,.11));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.21),0 7px 17px rgba(1,10,33,.19);
  color:#d7f5ff;
}
.profile-page .profile-signal:nth-child(3n) .profile-signal-icon { border-color:rgba(216,195,255,.27); background:linear-gradient(145deg,rgba(159,124,232,.24),rgba(88,84,171,.10)); color:#ebe1ff; }
.profile-page .profile-signal:nth-child(4n) .profile-signal-icon { border-color:rgba(255,221,157,.24); background:linear-gradient(145deg,rgba(223,170,86,.18),rgba(91,91,161,.10)); color:#fff0c5; }
.profile-page .profile-signal-icon .material-icons { font-size:19px; }
.profile-page .profile-signal-copy small { color:#a9c0d6; font-size:8px; font-weight:820; letter-spacing:.09em; }
.profile-page .profile-signal-copy strong { margin-top:5px; color:#f1f8ff; font-size:13px; font-weight:740; letter-spacing:-.01em; }
.profile-page .profile-signal:hover { transform:translate3d(0,-2px,0); background:linear-gradient(122deg,rgba(65,111,162,.48),rgba(20,35,59,.79)); }
.profile-page .profile-signal-grid .profile-signal:first-child:last-child { grid-column:1 / -1; }
@media (max-width:360px) {
  .profile-page .profile-information.profile-signal-board { padding-right:10px; padding-left:10px; }
  .profile-page .profile-signal-group { padding-left:10px; }
  .profile-page .profile-signal-group-heading { margin-left:-10px; padding-left:11px; }
  .profile-page .profile-signal { grid-template-columns:33px minmax(0,1fr); gap:8px; min-height:67px; padding:10px 9px; }
  .profile-page .profile-signal-icon { width:33px; height:33px; border-radius:11px 11px 11px 3px; }
  .profile-page .profile-signal-icon .material-icons { font-size:17px; }
  .profile-page .profile-signal-copy strong { font-size:11px; }
}
@media (prefers-reduced-motion:reduce) {
  .profile-page .profile-signal { transition:none; }
}

/* Profile atlas, second pass: deliberately remove the repeated “glowing
   card” language. This is an ink-and-metal LinkUUp passport: one calm
   surface, engraved dividers and a single travelling coordinate. */
.profile-page .profile-information.profile-signal-board {
  max-width:690px;
  padding-top:12px;
}
.profile-page .profile-signal-group {
  margin-bottom:30px;
  padding-left:0;
}
.profile-page .profile-signal-group::before { display:none; }
.profile-page .profile-signal-group-heading {
  height:30px;
  margin:0 0 5px;
  padding:0 1px;
}
.profile-page .profile-signal-group-heading > span {
  top:12px;
  left:1px;
  width:4px;
  height:4px;
  border:0;
  background:#b6ecff;
  box-shadow:0 0 9px rgba(124,211,255,.9);
}
.profile-page .profile-signal-group-heading small {
  padding:0 0 0 13px;
  color:#c6d6e9;
  font-family:Georgia,"Times New Roman",serif;
  font-size:11px;
  font-weight:600;
  letter-spacing:.075em;
  line-height:30px;
  text-transform:none;
}
.profile-page .profile-signal-group-heading small::first-letter { color:#dff7ff; }
.profile-page .profile-signal-group-heading small::after {
  top:15px;
  left:calc(100% + 9px);
  width:58px;
  background:linear-gradient(90deg,rgba(173,210,239,.36),transparent);
}
.profile-page .profile-signal-grid {
  gap:0;
  border:1px solid rgba(171,198,223,.19);
  border-radius:5px 5px 19px 5px;
  background:#101a2b;
  box-shadow:0 15px 30px rgba(1,7,19,.18),inset 0 1px 0 rgba(255,255,255,.035);
}
.profile-page .profile-signal-grid::before {
  top:auto;
  right:16px;
  bottom:13px;
  left:auto;
  width:58px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(148,214,246,.60),transparent);
  box-shadow:none;
}
.profile-page .profile-signal-grid::after {
  content:'';
  position:absolute;
  right:36px;
  bottom:11px;
  width:4px;
  height:4px;
  border-radius:50%;
  background:#c7f3ff;
  box-shadow:0 0 10px rgba(137,218,255,.95);
  animation:lup-profile-atlas-coordinate 10s cubic-bezier(.45,.05,.55,.95) infinite;
  pointer-events:none;
}
.profile-page .profile-signal {
  grid-template-columns:31px minmax(0,1fr);
  gap:10px;
  min-height:72px;
  padding:13px 13px 12px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.profile-page .profile-signal:nth-child(2n) { background:rgba(255,255,255,.018); }
.profile-page .profile-signal:nth-child(n+3) { border-top:1px solid rgba(181,204,225,.11); }
.profile-page .profile-signal:nth-child(2n) { border-left:1px solid rgba(181,204,225,.11); }
.profile-page .profile-signal::before,
.profile-page .profile-signal::after { display:none; content:none; }
.profile-page .profile-signal:hover {
  transform:none;
  background:rgba(118,173,216,.075);
}
.profile-page .profile-signal-icon {
  align-self:start;
  width:27px;
  height:27px;
  border:1px solid rgba(180,220,245,.34);
  border-radius:50%;
  background:transparent;
  box-shadow:inset 0 0 0 3px rgba(142,201,235,.035);
  color:#b9e6fa;
}
.profile-page .profile-signal-icon .material-icons {
  font-size:15px;
  filter:none;
}
.profile-page .profile-signal:nth-child(3n) .profile-signal-icon {
  border-color:rgba(210,197,255,.32);
  background:transparent;
  color:#dacdff;
}
.profile-page .profile-signal:nth-child(4n) .profile-signal-icon {
  border-color:rgba(255,218,159,.31);
  background:transparent;
  color:#ffe2a4;
}
.profile-page .profile-signal-copy small {
  color:#8299b1;
  font-size:8px;
  font-weight:800;
  letter-spacing:.105em;
}
.profile-page .profile-signal-copy strong {
  margin-top:5px;
  color:#edf5fc;
  font-size:13px;
  font-weight:650;
  letter-spacing:0;
}
.profile-page .profile-signal--private,
.profile-page .profile-signal--private:nth-child(2n) { background:rgba(81,56,99,.14); }
.profile-page .profile-signal--private .profile-signal-icon {
  border-color:rgba(220,193,248,.28);
  background:transparent;
  color:#e5d1fb;
  box-shadow:none;
}
@keyframes lup-profile-atlas-coordinate {
  0%,16% { opacity:0; transform:translateX(21px) scale(.55); }
  29% { opacity:1; transform:translateX(8px) scale(1); }
  48% { opacity:.52; transform:translateX(-10px) scale(.72); }
  62%,100% { opacity:0; transform:translateX(-24px) scale(.45); }
}
@media (max-width:360px) {
  .profile-page .profile-signal-group-heading small { font-size:10px; }
  .profile-page .profile-signal { grid-template-columns:27px minmax(0,1fr); gap:8px; min-height:64px; padding:10px 9px; }
  .profile-page .profile-signal-icon { width:24px; height:24px; }
  .profile-page .profile-signal-icon .material-icons { font-size:14px; }
  .profile-page .profile-signal-copy strong { font-size:11px; }
}
@media (prefers-reduced-motion:reduce) {
  .profile-page .profile-signal-grid::after { animation:none; opacity:.68; }
}

/* Profile passport: one composed instrument, not a stack of generated cards.
   The outer frame is the profile's readable boundary; the inner rules carry
   structure without giving every fact a different background. */
.profile-page .profile-information.profile-signal-board {
  position:relative;
  max-width:700px;
  margin:5px auto 38px;
  padding:15px 14px 13px;
  overflow:hidden;
  border:1px solid rgba(169,205,231,.24);
  border-radius:18px 18px 28px 7px;
  background:
    linear-gradient(112deg,rgba(47,83,122,.17),transparent 36%),
    radial-gradient(circle at 88% 11%,rgba(104,179,232,.12),transparent 23%),
    #0c1627;
  box-shadow:inset 0 1px 0 rgba(237,249,255,.09),inset 0 -34px 50px rgba(1,7,20,.22),0 18px 40px rgba(1,7,22,.18);
}
.profile-page .profile-information.profile-signal-board::before {
  content:'';
  position:absolute;
  inset:0;
  opacity:.42;
  background-image:linear-gradient(90deg,rgba(164,209,237,.07) 1px,transparent 1px),linear-gradient(rgba(164,209,237,.045) 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(120deg,transparent 3%,black 41%,transparent 90%);
  pointer-events:none;
}
.profile-page .profile-information.profile-signal-board::after {
  content:'';
  position:absolute;
  top:10px;
  right:12px;
  bottom:10px;
  width:2px;
  background:linear-gradient(180deg,transparent,rgba(165,227,255,.70) 24%,rgba(174,146,255,.26) 68%,transparent);
  box-shadow:0 0 15px rgba(111,200,255,.22);
  pointer-events:none;
}
.profile-page .profile-signal-group {
  position:relative;
  z-index:1;
  margin:0 0 17px;
}
.profile-page .profile-signal-group:last-child { margin-bottom:0; }
.profile-page .profile-signal-group-heading {
  height:31px;
  margin:0;
  padding:0 10px;
  border:1px solid rgba(184,216,238,.13);
  border-bottom:0;
  border-radius:10px 10px 0 0;
  background:rgba(5,13,27,.33);
}
.profile-page .profile-signal-group-heading > span {
  position:relative;
  top:auto;
  left:auto;
  width:6px;
  height:6px;
  border:1px solid rgba(210,244,255,.72);
  border-radius:50%;
  background:#91dbff;
  box-shadow:0 0 11px rgba(110,205,255,.67);
}
.profile-page .profile-signal-group-heading small {
  padding:0 0 0 8px;
  color:#d8e6f2;
  font-family:Georgia,"Times New Roman",serif;
  font-size:11px;
  font-weight:600;
  letter-spacing:.07em;
  line-height:30px;
}
.profile-page .profile-signal-group-heading small::after { display:none; }
.profile-page .profile-signal-grid {
  position:relative;
  z-index:1;
  border:1px solid rgba(184,216,238,.13);
  border-radius:0 0 13px 13px;
  background:rgba(6,14,28,.38);
  box-shadow:none;
}
.profile-page .profile-signal-grid::before {
  top:0;
  right:0;
  bottom:auto;
  left:0;
  width:auto;
  background:linear-gradient(90deg,transparent,rgba(171,223,250,.40),transparent);
}
.profile-page .profile-signal-grid::after { display:none; }
.profile-page .profile-signal {
  grid-template-columns:34px minmax(0,1fr);
  gap:10px;
  min-height:74px;
  padding:14px 13px;
  background:transparent;
}
.profile-page .profile-signal:nth-child(2n),
.profile-page .profile-signal--private:nth-child(2n) { background:rgba(255,255,255,.022); }
.profile-page .profile-signal:nth-child(n+3) { border-top-color:rgba(181,204,225,.13); }
.profile-page .profile-signal:nth-child(2n) { border-left-color:rgba(181,204,225,.13); }
.profile-page .profile-signal-icon {
  width:32px;
  height:32px;
  border:1px solid rgba(174,222,250,.30);
  border-radius:10px 10px 10px 3px;
  background:linear-gradient(145deg,rgba(117,200,240,.12),rgba(82,99,177,.05));
  box-shadow:inset 0 1px 0 rgba(243,251,255,.10),0 5px 13px rgba(0,8,24,.10);
  color:#bfeaff;
}
.profile-page .profile-signal:nth-child(3n) .profile-signal-icon { border-color:rgba(209,194,255,.30); color:#e0d5ff; }
.profile-page .profile-signal:nth-child(4n) .profile-signal-icon { border-color:rgba(255,218,159,.30); color:#ffe1a4; }
.profile-page .profile-signal-icon .material-icons { font-size:17px; }
.profile-page .profile-signal-copy small { color:#91a8bd; font-size:8px; letter-spacing:.11em; }
.profile-page .profile-signal-copy strong { color:#f1f7fc; font-size:13px; font-weight:680; }
.profile-page .profile-signal:hover { transform:none; background:rgba(117,181,223,.08); }
@media (max-width:360px) {
  .profile-page .profile-information.profile-signal-board { margin-right:10px; margin-left:10px; padding:11px 9px 9px; }
  .profile-page .profile-signal { grid-template-columns:29px minmax(0,1fr); min-height:66px; padding:11px 9px; }
  .profile-page .profile-signal-icon { width:28px; height:28px; border-radius:9px 9px 9px 3px; }
  .profile-page .profile-signal-copy strong { font-size:11px; }
}

/* Final profile field: remove the last window-like layers.  The profile is
   one continuous place; facts are only held together by type, rhythm and a
   few route marks behind them. */
.profile-page .user-profile-page {
  background:
    radial-gradient(ellipse 105% 38% at 3% 10%,rgba(86,166,233,.20),transparent 67%),
    radial-gradient(ellipse 92% 42% at 96% 57%,rgba(125,91,212,.16),transparent 69%),
    radial-gradient(ellipse 90% 31% at 32% 96%,rgba(48,116,190,.12),transparent 68%),
    linear-gradient(158deg,#111e34 0%,#101a2d 48%,#0d1729 100%);
}
.profile-page .profile-information.profile-signal-board {
  max-width:700px;
  margin:7px auto 42px;
  padding:8px 16px 20px;
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.profile-page .profile-information.profile-signal-board::before {
  top:24px;
  right:3%;
  bottom:0;
  left:3%;
  opacity:.55;
  background:
    linear-gradient(90deg,transparent,rgba(159,222,255,.13),transparent) 15% 0/100% 1px no-repeat,
    radial-gradient(ellipse at 76% 12%,rgba(100,191,245,.13),transparent 45%);
  mask-image:none;
}
.profile-page .profile-information.profile-signal-board::after {
  top:54px;
  right:8%;
  bottom:16px;
  width:1px;
  opacity:.58;
  background:linear-gradient(180deg,transparent,rgba(165,227,255,.50) 20%,rgba(174,146,255,.20) 70%,transparent);
}
.profile-page .profile-signal-group {
  margin:0 0 26px;
  padding:0;
}
.profile-page .profile-signal-group-heading {
  height:34px;
  margin:0;
  padding:0 2px;
  border:0;
  border-radius:0;
  background:transparent;
}
.profile-page .profile-signal-group-heading > span {
  width:5px;
  height:5px;
  border:0;
  background:#a9e7ff;
}
.profile-page .profile-signal-group-heading small {
  padding-left:10px;
  color:#dceafa;
  font-family:Ubuntu,Roboto,Arial,sans-serif;
  font-size:9px;
  font-weight:790;
  letter-spacing:.145em;
  line-height:34px;
  text-transform:uppercase;
}
.profile-page .profile-signal-grid {
  border:0;
  border-radius:0;
  background:transparent;
}
.profile-page .profile-signal-grid::before {
  top:0;
  right:0;
  bottom:auto;
  left:0;
  width:auto;
  opacity:.86;
}
.profile-page .profile-signal {
  min-height:69px;
  padding:12px 6px;
  border:0;
  border-radius:0;
  background:transparent;
}
.profile-page .profile-signal:nth-child(2n),
.profile-page .profile-signal--private:nth-child(2n) { background:transparent; }
.profile-page .profile-signal:nth-child(n+3) { border-top:1px solid rgba(185,214,234,.15); }
.profile-page .profile-signal:nth-child(2n) { border-left:1px solid rgba(185,214,234,.15); }
.profile-page .profile-signal::before { display:block; content:''; position:absolute; top:14px; bottom:14px; left:0; width:1px; background:linear-gradient(180deg,transparent,rgba(167,225,250,.34),transparent); }
.profile-page .profile-signal:nth-child(2n)::before { left:auto; right:0; opacity:.55; }
.profile-page .profile-signal-icon {
  width:31px;
  height:31px;
  border-radius:50%;
  background:rgba(112,188,234,.07);
  box-shadow:inset 0 0 0 3px rgba(177,227,251,.025),0 0 0 1px rgba(176,224,249,.06);
}
.profile-page .profile-signal-icon .material-icons { font-size:16px; }
.profile-page .profile-signal:hover { transform:none; background:rgba(128,191,230,.045); }
.profile-page .profile-signal-copy small { color:#93acc5; }
.profile-page .profile-signal-copy strong { color:#f1f7ff; }
.profile-page .profile-signal--private { background:rgba(105,76,128,.08); }
@media (max-width:360px) {
  .profile-page .profile-information.profile-signal-board { margin-right:0; margin-left:0; padding-right:11px; padding-left:11px; }
  .profile-page .profile-signal { min-height:63px; padding:10px 4px; }
  .profile-page .profile-signal-icon { width:27px; height:27px; }
}

/* Align the fact icons with the five upper profile controls.  The only light
   left in the facts is a short route glint, never a border pretending to be a
   table. */
.profile-page .profile-signal-group::after {
  content:'';
  position:absolute;
  z-index:2;
  top:17px;
  left:46%;
  width:36px;
  height:1px;
  border:0;
  background:linear-gradient(90deg,transparent,rgba(164,228,255,.74),transparent);
  box-shadow:0 0 9px rgba(123,206,255,.28);
  opacity:.72;
  pointer-events:none;
}
.profile-page .profile-signal-group:nth-child(2n)::after { left:auto; right:16%; width:27px; opacity:.48; }
.profile-page .profile-signal-grid::before,
.profile-page .profile-signal:nth-child(n+3),
.profile-page .profile-signal:nth-child(2n),
.profile-page .profile-signal::before { border:0; background:transparent; }
.profile-page .profile-signal-icon {
  width:34px;
  height:34px;
  border:1px solid rgba(183,224,250,.26);
  border-radius:12px 12px 12px 4px;
  background:linear-gradient(145deg,rgba(121,202,241,.16),rgba(85,101,182,.07));
  box-shadow:inset 0 1px 0 rgba(245,252,255,.13),0 7px 15px rgba(0,8,24,.12);
}
.profile-page .profile-signal:nth-child(3n) .profile-signal-icon { background:linear-gradient(145deg,rgba(165,137,238,.15),rgba(85,101,182,.06)); }
.profile-page .profile-signal:nth-child(4n) .profile-signal-icon { background:linear-gradient(145deg,rgba(240,188,105,.15),rgba(85,101,182,.05)); }
.profile-page .profile-signal-icon .material-icons { font-size:18px; }
.profile-page .profile-information.profile-signal-board,
.profile-page .profile-information.profile-about-single,
.profile-page .information-tabs,
.profile-page .information-tabs md-content,
.profile-page .information-tabs .md-tab-content { background-color:transparent; }
@media (max-width:360px) {
  .profile-page .profile-signal-icon { width:29px; height:29px; border-radius:10px 10px 10px 3px; }
  .profile-page .profile-signal-icon .material-icons { font-size:16px; }
}

/* The facts use an open coordinate grid: no enclosing card, only the two
   axes needed to read a paired profile at a glance. */
.profile-page .profile-information.profile-signal-board {
  border:0;
  outline:0;
  box-shadow:none;
}
.profile-page .profile-information.profile-signal-board::after { display:none; content:none; }
.profile-page .profile-signal-group-heading { border:0; background:transparent; }
.profile-page .profile-signal-grid {
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
}
.profile-page .profile-signal-grid::before {
  display:block;
  top:0;
  right:auto;
  bottom:0;
  left:50%;
  width:1px;
  height:auto;
  opacity:1;
  background:linear-gradient(180deg,transparent,rgba(170,222,248,.18) 8%,rgba(170,222,248,.18) 92%,transparent);
  box-shadow:0 0 7px rgba(100,192,245,.07);
}
.profile-page .profile-signal {
  background:transparent;
  border:0;
}
.profile-page .profile-signal:nth-child(n+3) {
  border-top:1px solid rgba(170,222,248,.14);
}
.profile-page .profile-signal:nth-child(2n) { border-left:0; }
.profile-page .profile-signal::before { display:none; content:none; }
.profile-page .profile-signal:hover { background:rgba(128,191,230,.035); }

/* Floating profile constellation: information points remain precise, while a
   single slow signal gives the whole page a living direction. */
.profile-page .profile-information.profile-signal-board {
  padding-top:14px;
  padding-bottom:45px;
}
.profile-page .profile-information.profile-signal-board::before {
  top:5px;
  right:0;
  bottom:0;
  left:0;
  opacity:1;
  background:
    radial-gradient(ellipse 38% 12% at 79% 16%,rgba(133,208,247,.14),transparent 70%),
    radial-gradient(ellipse 49% 15% at 23% 78%,rgba(155,118,235,.10),transparent 72%);
}
.profile-page .profile-information.profile-signal-board::after {
  display:block;
  content:'';
  position:absolute;
  z-index:0;
  top:47px;
  right:18%;
  width:5px;
  height:5px;
  border:0;
  border-radius:50%;
  background:#d6f6ff;
  box-shadow:0 0 0 4px rgba(106,203,247,.07),0 0 17px rgba(120,211,255,.82);
  opacity:.24;
  animation:lup-profile-constellation-signal 17s ease-in-out infinite;
  pointer-events:none;
}
.profile-page .profile-signal-group { margin-bottom:32px; }
.profile-page .profile-signal-group::after { display:none; content:none; }
.profile-page .profile-signal-group-heading { height:29px; padding-left:5px; }
.profile-page .profile-signal-group-heading small { color:#b9d2e6; font-size:8px; line-height:29px; }
.profile-page .profile-signal-grid {
  gap:17px 26px;
  background:transparent;
}
.profile-page .profile-signal-grid::before { display:none; content:none; }
.profile-page .profile-signal {
  min-height:58px;
  padding:4px 2px;
  border:0;
  background:transparent;
}
.profile-page .profile-signal:nth-child(n+3),
.profile-page .profile-signal:nth-child(2n) { border:0; background:transparent; }
.profile-page .profile-signal:hover { background:transparent; }
.profile-page .profile-signal-icon {
  align-self:center;
  width:34px;
  height:34px;
  background:linear-gradient(145deg,rgba(117,203,245,.20),rgba(86,101,186,.08));
  box-shadow:inset 0 1px 0 rgba(246,253,255,.16),0 8px 18px rgba(0,9,27,.14);
}
.profile-page .profile-signal-copy small { color:#8faac2; font-size:8px; }
.profile-page .profile-signal-copy strong { margin-top:3px; color:#f3f8ff; font-size:13px; }
@keyframes lup-profile-constellation-signal {
  0%,14% { opacity:0; transform:translate3d(0,0,0) scale(.5); }
  31% { opacity:.78; transform:translate3d(-48px,68px,0) scale(1); }
  52% { opacity:.25; transform:translate3d(-94px,155px,0) scale(.66); }
  72%,100% { opacity:0; transform:translate3d(-132px,240px,0) scale(.4); }
}
@media (max-width:360px) {
  .profile-page .profile-signal-grid { gap:13px 15px; }
  .profile-page .profile-signal { min-height:54px; }
  .profile-page .profile-signal-icon { width:29px; height:29px; }
  .profile-page .profile-signal-copy strong { font-size:11px; }
}
@media (prefers-reduced-motion:reduce) {
  .profile-page .profile-information.profile-signal-board::after { animation:none; opacity:.48; }
}

/* The profile opens like a personal insight, not like a settings drawer. */
.profile-page .profile-insight-control {
  position:relative;
  z-index:2;
  width:min(100%,680px);
  margin:2px auto 0;
  padding:0 16px;
}
.profile-page .profile-insight-toggle {
  display:grid;
  grid-template-columns:minmax(0,1fr) 24px;
  gap:8px;
  align-items:center;
  width:100%;
  min-height:57px;
  padding:8px 3px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:#eff8ff;
  text-align:left;
}
.profile-page .profile-insight-toggle::before {
  content:'';
  position:absolute;
  right:5px;
  bottom:0;
  left:5px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(159,219,247,.34),transparent);
  box-shadow:0 0 10px rgba(95,187,242,.11);
}
.profile-page .profile-insight-toggle-copy { display:block; min-width:0; }
.profile-page .profile-insight-toggle-copy small,
.profile-page .profile-insight-toggle-copy strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.profile-page .profile-insight-toggle-copy small { color:#91abc2; font-size:8px; font-weight:800; letter-spacing:.13em; line-height:1.2; }
.profile-page .profile-insight-toggle-copy strong { margin-top:3px; color:#eef7ff; font-size:13px; font-weight:690; line-height:1.25; }
.profile-page .profile-insight-chevron { justify-self:end; color:#a8dcf8; font-size:20px; transition:transform 240ms cubic-bezier(.22,.8,.24,1),color 180ms ease; }
.profile-page .profile-insight-toggle.is-open .profile-insight-chevron { transform:translateY(-1px); color:#e5f7ff; }
.profile-page .profile-insight-toggle.is-open::before { background:linear-gradient(90deg,transparent,rgba(191,235,255,.72),transparent); }
.profile-page .profile-detail-reveal {
  position:relative;
  z-index:1;
  max-height:0;
  overflow:hidden;
  opacity:0;
  pointer-events:none;
  transform:translate3d(0,-10px,0);
  transition:max-height 520ms ease,opacity 250ms ease,transform 420ms cubic-bezier(.22,.8,.24,1);
}
.profile-page .profile-detail-reveal.is-open {
  max-height:1600px;
  opacity:1;
  pointer-events:auto;
  transform:translate3d(0,0,0);
}
.profile-page .profile-detail-reveal .profile-signal-board { margin-top:10px; }
@media (max-width:360px) {
  .profile-page .profile-insight-control { padding-right:11px; padding-left:11px; }
  .profile-page .profile-insight-toggle { grid-template-columns:minmax(0,1fr) 21px; gap:8px; min-height:52px; }
  .profile-page .profile-insight-toggle-copy strong { font-size:11px; }
}
@media (prefers-reduced-motion:reduce) {
  .profile-page .profile-detail-reveal,.profile-page .profile-insight-chevron { transition:none; }
}

/* Each revealed fact is a compact LinkUUp signal.  Its light intensity is
   literal: bright for everybody, restrained for circles, dim for the owner
   alone.  The server remains the source of truth for every ACL. */
.profile-page .profile-detail-reveal .profile-signal-grid {
  gap:9px 11px;
}
.profile-page .profile-detail-reveal .profile-signal {
  grid-template-columns:34px minmax(0,1fr) 19px;
  gap:9px;
  min-height:67px;
  padding:10px 9px;
  overflow:hidden;
  border:1px solid rgba(169,215,244,.16);
  border-radius:14px 14px 14px 5px;
  background:linear-gradient(145deg,rgba(87,151,207,.10),rgba(11,24,44,.14));
  box-shadow:inset 0 1px 0 rgba(244,252,255,.055),0 9px 20px rgba(1,8,24,.08);
}
.profile-page .profile-detail-reveal .profile-signal::after {
  display:block;
  content:'';
  position:absolute;
  right:-12px;
  bottom:-14px;
  width:46px;
  height:46px;
  border:1px solid rgba(176,231,255,.11);
  border-radius:50%;
  background:transparent;
  pointer-events:none;
}
.profile-page .profile-detail-reveal .profile-signal--public {
  border-color:rgba(159,224,252,.31);
  background:linear-gradient(145deg,rgba(93,177,223,.17),rgba(15,30,53,.16));
  box-shadow:inset 0 1px 0 rgba(247,253,255,.10),0 0 18px rgba(100,197,246,.09);
}
.profile-page .profile-detail-reveal .profile-signal--members { border-color:rgba(178,190,255,.24); }
.profile-page .profile-detail-reveal .profile-signal--friends { border-color:rgba(255,202,232,.22); }
.profile-page .profile-detail-reveal .profile-signal--private {
  border-color:rgba(185,163,209,.13);
  background:rgba(67,49,86,.15);
  box-shadow:none;
  opacity:.68;
}
.profile-page .profile-detail-reveal .profile-signal-icon { width:33px; height:33px; }
.profile-page .profile-signal-visibility {
  display:grid;
  place-items:center;
  align-self:start;
  width:18px;
  height:18px;
  margin-top:1px;
  border-radius:50%;
  background:rgba(139,197,230,.09);
  color:#9edcf8;
}
.profile-page .profile-signal-visibility .material-icons { font-size:12px; }
.profile-page .profile-signal--public .profile-signal-visibility { background:rgba(143,222,254,.15); color:#d1f3ff; box-shadow:0 0 11px rgba(111,207,252,.42); }
.profile-page .profile-signal--members .profile-signal-visibility { color:#c8cbff; }
.profile-page .profile-signal--friends .profile-signal-visibility { color:#ffc4df; }
.profile-page .profile-signal--private .profile-signal-visibility { background:rgba(187,159,210,.07); color:#c6b7d5; box-shadow:none; }
@media (max-width:360px) {
  .profile-page .profile-detail-reveal .profile-signal-grid { gap:7px; }
  .profile-page .profile-detail-reveal .profile-signal { grid-template-columns:29px minmax(0,1fr) 16px; gap:7px; min-height:62px; padding:9px 7px; }
  .profile-page .profile-detail-reveal .profile-signal-icon { width:28px; height:28px; }
  .profile-page .profile-signal-visibility { width:16px; height:16px; }
  .profile-page .profile-signal-visibility .material-icons { font-size:11px; }
}

/* Visibility is written plainly for the profile owner.  It deliberately has
   no round badge: the field's own icon remains the only large symbol. */
.profile-page .profile-detail-reveal .profile-signal::after { display:none; content:none; }
.profile-page .profile-detail-reveal .profile-signal-copy { padding-bottom:12px; }
.profile-page .profile-signal-visibility {
  position:absolute;
  right:9px;
  bottom:7px;
  display:inline-flex;
  align-items:center;
  gap:3px;
  width:auto;
  height:auto;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:#8fa7bd;
  font-size:7px;
  font-weight:780;
  letter-spacing:.055em;
  line-height:1;
  text-transform:uppercase;
}
.profile-page .profile-signal-visibility .material-icons { color:inherit; font-size:11px; }
.profile-page .profile-signal--public .profile-signal-visibility {
  color:#bbecff;
  text-shadow:0 0 9px rgba(105,206,255,.45);
}
.profile-page .profile-signal--members .profile-signal-visibility { color:#c9c9ff; }
.profile-page .profile-signal--friends .profile-signal-visibility { color:#ffc4df; }
.profile-page .profile-signal--private .profile-signal-visibility { color:#a798b2; text-shadow:none; }
@media (max-width:360px) {
  .profile-page .profile-detail-reveal .profile-signal-copy { padding-bottom:10px; }
  .profile-page .profile-signal-visibility { right:7px; bottom:6px; font-size:6px; }
  .profile-page .profile-signal-visibility .material-icons { font-size:10px; }
}

/* Visibility is enforced by the server; it is intentionally not repeated as
   decoration inside the profile insight. */
.profile-page .profile-detail-reveal .profile-signal-copy { padding-bottom:0; }
.profile-page .profile-signal-visibility { display:none; }

/* Profile detail signals: no cards, only a category-coloured light line.
   The line is an affordance, not a privacy leak: fields the server withholds
   for a visitor do not exist in this DOM at all. */
.profile-page .profile-detail-reveal .profile-signal-grid {
  gap:14px 21px;
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.profile-page .profile-detail-reveal .profile-signal {
  --profile-tone:#a9ddff;
  --profile-tone-soft:rgba(169,221,255,.18);
  grid-template-columns:31px minmax(0,1fr);
  gap:9px;
  min-height:54px;
  padding:4px 2px 13px;
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.profile-page .profile-detail-reveal .profile-signal::before { display:none; content:none; }
.profile-page .profile-detail-reveal .profile-signal::after {
  display:block;
  content:'';
  position:absolute;
  right:1px;
  bottom:0;
  left:1px;
  width:auto;
  height:1px;
  border:0;
  border-radius:999px;
  background:linear-gradient(90deg,transparent 0%,var(--profile-tone) 16%,var(--profile-tone) 84%,transparent 100%);
  box-shadow:0 0 8px var(--profile-tone-soft),0 0 18px var(--profile-tone-soft);
  opacity:.74;
  pointer-events:none;
}
.profile-page .profile-detail-reveal .profile-signal:hover { background:transparent; }
.profile-page .profile-detail-reveal .profile-signal-icon {
  width:31px;
  height:31px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:var(--profile-tone);
  filter:drop-shadow(0 0 7px var(--profile-tone-soft));
}
.profile-page .profile-detail-reveal .profile-signal-icon .material-icons { font-size:20px; }
.profile-page .profile-detail-reveal .profile-signal-copy small { color:var(--profile-tone); opacity:.78; }
.profile-page .profile-detail-reveal .profile-signal-copy strong { color:#f3f8ff; }
.profile-page .profile-detail-reveal .profile-signal--tone-sky { --profile-tone:#8fd8ff; --profile-tone-soft:rgba(110,205,255,.22); }
.profile-page .profile-detail-reveal .profile-signal--tone-blue { --profile-tone:#8eb9ff; --profile-tone-soft:rgba(113,158,255,.22); }
.profile-page .profile-detail-reveal .profile-signal--tone-ice { --profile-tone:#bceeff; --profile-tone-soft:rgba(145,224,255,.22); }
.profile-page .profile-detail-reveal .profile-signal--tone-teal { --profile-tone:#78e0d0; --profile-tone-soft:rgba(78,218,196,.20); }
.profile-page .profile-detail-reveal .profile-signal--tone-violet { --profile-tone:#c1a9ff; --profile-tone-soft:rgba(178,142,255,.21); }
.profile-page .profile-detail-reveal .profile-signal--tone-lilac { --profile-tone:#d8b6ff; --profile-tone-soft:rgba(205,159,255,.21); }
.profile-page .profile-detail-reveal .profile-signal--tone-rose { --profile-tone:#ffadd0; --profile-tone-soft:rgba(255,142,191,.20); }
.profile-page .profile-detail-reveal .profile-signal--tone-amber { --profile-tone:#efc06f; --profile-tone-soft:rgba(226,170,79,.23); }
.profile-page .profile-detail-reveal .profile-signal--tone-gold { --profile-tone:#ffd67e; --profile-tone-soft:rgba(255,202,91,.21); }
.profile-page .profile-detail-reveal .profile-signal--tone-coral { --profile-tone:#f2a18f; --profile-tone-soft:rgba(241,133,111,.20); }
.profile-page .profile-detail-reveal .profile-signal--tone-mint { --profile-tone:#8cddb1; --profile-tone-soft:rgba(95,213,146,.20); }
.profile-page .profile-detail-reveal .profile-signal--private {
  filter:saturate(.62);
  opacity:.42;
}
.profile-page .profile-detail-reveal .profile-signal--private::after {
  opacity:.15;
  box-shadow:none;
}

/* The category glyph is the anchor, never another little card.  Give it enough
   scale to read immediately; its own coloured light line carries the grouping. */
.profile-page .profile-detail-reveal .profile-signal {
  grid-template-columns:36px minmax(0,1fr);
  gap:10px;
}
.profile-page .profile-detail-reveal .profile-signal-icon {
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  padding:0;
  outline:0;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
  filter:drop-shadow(0 0 5px var(--profile-tone-soft)) drop-shadow(0 0 12px rgba(7,18,38,.24));
}
.profile-page .profile-detail-reveal .profile-signal-icon::before,
.profile-page .profile-detail-reveal .profile-signal-icon::after {
  display:none;
  content:none;
}
.profile-page .profile-detail-reveal .profile-signal-icon .material-icons {
  color:var(--profile-tone);
  font-size:23px;
  line-height:1;
  text-shadow:0 0 8px var(--profile-tone-soft);
}
/* Older position-based colour variants carried a more specific boxed icon
   treatment.  The profile now always uses the free glyph + its own glow. */
.profile-page .profile-detail-reveal .profile-signal .profile-signal-icon,
.profile-page .profile-detail-reveal .profile-signal:nth-child(3n) .profile-signal-icon,
.profile-page .profile-detail-reveal .profile-signal:nth-child(4n) .profile-signal-icon,
.profile-page .profile-detail-reveal .profile-signal--denied .profile-signal-icon {
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:var(--profile-tone);
}
@media (max-width:360px) {
  .profile-page .profile-detail-reveal .profile-signal-grid { gap:12px 14px; }
  .profile-page .profile-detail-reveal .profile-signal { grid-template-columns:31px minmax(0,1fr); gap:8px; min-height:52px; }
  .profile-page .profile-detail-reveal .profile-signal-icon { width:31px; height:31px; }
  .profile-page .profile-detail-reveal .profile-signal-icon .material-icons { font-size:20px; }
}

/* Shared dialog shell: ordinary messages use one calm LinkUUp surface.
   Feature dialogs retain their own component styles. */
.md-dialog-container .lup-dialog-shell { width:min(392px,calc(100vw - 28px)); max-height:calc(100dvh - 28px); overflow:hidden; border:1px solid rgba(185,218,255,.20); border-radius:23px; background:radial-gradient(circle at 86% -6%,rgba(109,175,244,.20),transparent 39%),linear-gradient(154deg,#172640,#0b1322 72%); box-shadow:0 28px 76px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.11); color:#eef6ff; }
.lup-dialog-shell md-toolbar,.lup-dialog-shell md-toolbar .md-toolbar-tools { position:relative; min-height:64px; height:64px; padding:0 16px; overflow:visible; border:0; background:linear-gradient(90deg,rgba(136,193,245,.08),transparent 64%); }
.lup-dialog-shell .md-toolbar-tools h2 { margin:0; color:#f5f9ff; font-size:18px; font-weight:780; letter-spacing:-.025em; }
.lup-dialog-shell .md-icon-button { position:relative; z-index:4; display:grid; flex:0 0 33px; width:33px; height:33px; min-height:33px; margin:0; padding:0; place-items:center; border:1px solid rgba(212,234,255,.15); border-radius:10px; background:rgba(7,15,28,.86); color:#d6e7f9; }
.lup-dialog-shell .md-icon-button .material-icons { font-size:18px; }
.lup-dialog-shell md-dialog-content,.lup-dialog-shell .md-dialog-content { background:transparent; }
.lup-dialog-shell .md-dialog-content { padding:6px 50px 15px 17px; color:#c5d3e5; font-size:12px; line-height:1.5; }
.lup-dialog-shell .md-dialog-content p { margin:6px 0 11px; }
.lup-dialog-shell .md-dialog-content a { color:#a9dcfa; font-weight:720; text-decoration:none; }
.lup-dialog-shell .md-dialog-content pre { margin:9px 0 0; padding:11px; overflow:auto; border:1px solid rgba(188,219,250,.12); border-radius:12px; background:rgba(4,11,23,.32); color:#dcecff; font:11px/1.45 monospace; white-space:pre-wrap; }
.lup-dialog-shell md-dialog-actions { min-height:61px; padding:10px 17px 15px; border-top:1px solid rgba(190,219,248,.10); }
.lup-dialog-shell md-dialog-actions .md-button { min-height:39px; margin:0 0 0 8px; border:1px solid rgba(190,219,248,.16); border-radius:11px; background:rgba(255,255,255,.035); color:#d9e8f7; font-size:12px; font-weight:740; text-transform:none; }
.lup-dialog-shell md-dialog-actions .md-button:last-child { border-color:rgba(167,220,255,.30); background:linear-gradient(135deg,rgba(83,166,226,.30),rgba(93,99,194,.25)); color:#f4fbff; box-shadow:inset 0 1px 0 rgba(255,255,255,.18); }
.lup-qr-dialog .md-dialog-content { display:grid; justify-items:center; padding-top:8px; text-align:center; }
.lup-qr-dialog .md-dialog-content p { max-width:280px; }
.lup-qr-dialog .qr-dialog-eyebrow { display:block; margin-top:1px; color:#9fdcff; font-size:9px; font-weight:880; letter-spacing:.16em; }
.lup-qr-dialog .qr-dialog-place { display:block; max-width:280px; margin:4px auto 2px; overflow:hidden; color:#f4f9ff; font-size:19px; font-weight:780; letter-spacing:-.025em; text-overflow:ellipsis; white-space:nowrap; }
.lup-qr-dialog .qrcode { display:block; width:min(218px,66vw); height:auto; margin:7px auto 4px; padding:12px; box-sizing:border-box; border:1px solid rgba(210,237,255,.28); border-radius:17px; background:#f8fbff; box-shadow:0 0 0 7px rgba(112,182,243,.07),0 14px 29px rgba(0,0,0,.20); }
.lup-qr-dialog .qr-dialog-scan { display:inline-flex; align-items:center; gap:5px; margin:9px 0 3px; color:#aeeaff; font-size:9px; font-weight:850; letter-spacing:.11em; }.lup-qr-dialog .qr-dialog-scan .material-icons { font-size:15px; }
.lup-qr-dialog .qr-dialog-note { display:flex; max-width:286px; align-items:flex-start; gap:6px; margin:8px auto 0; padding:8px 9px; border-left:2px solid rgba(143,216,255,.72); background:rgba(118,187,245,.07); color:#b9cce1; font-size:10px; line-height:1.35; text-align:left; }.lup-qr-dialog .qr-dialog-note .material-icons { flex:0 0 auto; color:#a9e1ff; font-size:15px; }
.lup-help-dialog .md-dialog-content { padding-top:10px; }
.lup-help-dialog .md-dialog-content > *:first-child { margin-top:0; }
@media (max-width:360px) { .md-dialog-container .lup-dialog-shell { width:calc(100vw - 20px); border-radius:18px; }.lup-dialog-shell md-toolbar,.lup-dialog-shell md-toolbar .md-toolbar-tools { min-height:59px; height:59px; padding:0 13px; }.lup-dialog-shell .md-toolbar-tools h2 { font-size:16px; }.lup-dialog-shell .md-dialog-content { padding-right:43px; padding-left:13px; }.lup-dialog-shell md-dialog-actions { padding-right:13px; padding-left:13px; }.lup-qr-dialog .qrcode { width:min(204px,68vw); } }

/* Shared route field -------------------------------------------------------
   Location is the visual reference: every signed-in destination now shares
   one quiet midnight field.  Individual pages keep their own content accent.
   This is deliberately surface-only: no route, action or data flow changes. */
.profile-page > md-content,
.friends-page > md-content,
.notification > md-content,
.settings-page > md-content,
.account-page > md-content,
.likes-page > md-content,
.location-page > md-content {
  position:relative;
  isolation:isolate;
  background:
    radial-gradient(ellipse 74% 40% at 50% -9%,rgba(91,151,224,.11),transparent 72%),
    linear-gradient(160deg,#090e19 0%,#0a1120 54%,#070b13 100%);
}
.profile-page > md-content::before,
.friends-page > md-content::before,
.notification > md-content::before,
.settings-page > md-content::before,
.account-page > md-content::before,
.likes-page > md-content::before {
  position:absolute;
  z-index:-1;
  inset:0;
  content:'';
  pointer-events:none;
  opacity:.48;
  background:
    radial-gradient(circle at 13% 21%,rgba(124,207,255,.36) 0 1px,transparent 2px),
    radial-gradient(circle at 82% 17%,rgba(178,132,255,.31) 0 1px,transparent 2px),
    radial-gradient(circle at 73% 73%,rgba(109,195,255,.22) 0 1px,transparent 2px),
    radial-gradient(circle at 24% 81%,rgba(166,142,255,.20) 0 1px,transparent 2px);
  animation:lup-shared-field-drift 22s ease-in-out infinite alternate;
}
.profile-page md-toolbar:not(.sidenav-brand),
.friends-page md-toolbar:not(.sidenav-brand),
.notification md-toolbar:not(.sidenav-brand),
.settings-page md-toolbar:not(.sidenav-brand),
.account-page md-toolbar:not(.sidenav-brand),
.likes-page md-toolbar:not(.sidenav-brand),
.location-page md-toolbar:not(.sidenav-brand) {
  background:linear-gradient(180deg,rgba(9,15,27,.93),rgba(9,15,27,.64));
  border-bottom:1px solid rgba(164,207,245,.10);
  box-shadow:none;
}
.profile-page .profile-section-nav,
.notification .notification-switch,
.settings-page .lup-settings-group,
.account-page .account-form,
.friends-page .lup-user-list,
.likes-page .ups-favorite,
.likes-page .ups-empty-preview,
.location-reviews-page .reviews-scoreboard,
.location-reviews-page .reviews-compose {
  border-color:rgba(175,214,249,.15);
  background:linear-gradient(145deg,rgba(26,42,66,.48),rgba(8,15,27,.54));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 14px 32px rgba(0,0,0,.14);
}
.profile-page .profile-section-nav button,
.notification .notification-switch button {
  color:#b8c8db;
}
.profile-page .profile-section-nav button.active,
.notification .notification-switch button.active {
  color:#f2f9ff;
  background:linear-gradient(135deg,rgba(105,191,241,.16),rgba(122,97,211,.14));
}
.friends-page .lup-user-list md-list-item,
.notification .notification-panel md-list-item,
.likes-page .ups-list md-list-item,
.location-reviews-page .reviews-list md-list-item {
  border-bottom-color:rgba(184,216,246,.09);
}
@keyframes lup-shared-field-drift { from { transform:translate3d(-1.5%,-.5%,0); } to { transform:translate3d(1.5%,1.5%,0); } }
@media (prefers-reduced-motion:reduce) {
  .profile-page > md-content::before,.friends-page > md-content::before,.notification > md-content::before,.settings-page > md-content::before,.account-page > md-content::before,.likes-page > md-content::before { animation:none; }
}