/* Shared member shell refinement. Loaded after the feature sheets. */
.live-member {
  --control-height:44px;
  --control-height-compact:44px;
  --control-border:1px;
  --control-radius:10px;
  --control-pad-inline:16px;
  --member-refinement-border:color-mix(in srgb,var(--accent) 17%,var(--border));
  --member-refinement-shadow:0 10px 28px color-mix(in srgb,var(--accent) 9%,transparent);
  background-image:
    radial-gradient(circle at 76% -8%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 30%),
    linear-gradient(var(--grid) 1px,transparent 1px),
    linear-gradient(90deg,var(--grid) 1px,transparent 1px);
  background-size:100% 700px,44px 44px,44px 44px;
  background-repeat:no-repeat,repeat,repeat;
}

/* A compact product bar gives the logo and account controls one clear job. */
.live-member .member-header {
  min-height:60px;
  padding:9px clamp(16px,3vw,40px);
  border-bottom:1px solid var(--member-refinement-border);
  background:color-mix(in srgb,var(--panel) 92%,transparent);
  box-shadow:0 1px 0 color-mix(in srgb,var(--accent) 7%,transparent);
}

.live-member .member-header > .actions { min-width:0; gap:6px; }
.live-member .member-brand { gap:9px; }
.live-member .member-brand img { width:min(180px,48vw); height:auto; }
.live-member .member-brand .beta-badge {
  padding:3px 7px;
  border:1px solid color-mix(in srgb,var(--accent) 44%,var(--border));
  border-radius:6px;
  color:var(--accent-text);
  background:color-mix(in srgb,var(--accent) 5%,var(--panel));
  font-size:9px;
  letter-spacing:.08em;
}

/* Navigation remains one compact orientation row; it scrolls on small screens. */
.live-member .member-nav {
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  justify-content:center;
  gap:2px;
  max-width:100%;
  margin:0 0 20px;
  padding:6px 2px;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scrollbar-width:thin;
  border-bottom:1px solid var(--member-refinement-border);
  -webkit-overflow-scrolling:touch;
}

.live-member .member-nav button {
  flex:0 0 auto;
  min-height:44px;
  padding:8px 12px;
  border-color:transparent !important;
  border-radius:8px;
  background:transparent;
  box-shadow:none !important;
  color:var(--body);
  font-size:14px;
  font-weight:650;
  white-space:nowrap;
}

.live-member .member-nav button:hover:not(:disabled),
.live-member .member-nav button[aria-current="page"] {
  border-color:color-mix(in srgb,var(--accent) 24%,var(--border)) !important;
  background:color-mix(in srgb,var(--accent) 9%,var(--panel));
  color:var(--accent-text);
}

.live-member .member-nav button[aria-current="page"] {
  box-shadow:inset 0 -2px 0 var(--accent) !important;
}

/* Controls share a quiet, touch-ready grammar without changing their actions. */
.live-member :is(button,.button,.button-link) {
  min-height:44px;
  padding:9px var(--control-pad-inline);
  border:1px solid var(--member-refinement-border);
  border-radius:var(--control-radius);
  background:var(--well);
  box-shadow:0 1px 2px color-mix(in srgb,var(--accent) 6%,transparent);
  color:var(--text);
  font-size:14px;
  font-weight:650;
  line-height:1.25;
  text-transform:none !important;
}

.live-member :is(button,.button,.button-link):hover:not(:disabled):not([aria-disabled="true"]) {
  border-color:color-mix(in srgb,var(--accent) 52%,var(--border));
  background:color-mix(in srgb,var(--accent) 6%,var(--well));
  box-shadow:0 5px 14px color-mix(in srgb,var(--accent) 12%,transparent);
  filter:none;
}

.live-member :is(button,.button,.button-link):active:not(:disabled):not([aria-disabled="true"]) {
  transform:translateY(1px);
  box-shadow:0 1px 3px color-mix(in srgb,var(--accent) 10%,transparent) !important;
}

.live-member :is(button,.button,.button-link):focus-visible,
.live-member :is(input,select,textarea):focus-visible {
  outline:3px solid color-mix(in srgb,var(--accent) 46%,transparent) !important;
  outline-offset:2px;
  border-color:var(--accent) !important;
  box-shadow:0 0 0 1px var(--accent) !important;
}

.live-member :is(button.primary,.button--primary) {
  border-color:color-mix(in srgb,var(--accent) 68%,var(--border));
  background:var(--cta-grad);
  box-shadow:0 7px 16px color-mix(in srgb,var(--accent) 25%,transparent);
  color:var(--accent-ink);
}

.live-member :is(button.primary,.button--primary):hover:not(:disabled):not([aria-disabled="true"]) {
  border-color:var(--accent);
  background:var(--cta-grad-hi);
  box-shadow:0 9px 20px color-mix(in srgb,var(--accent) 30%,transparent);
}

.live-member :is(.button--quiet,.button--ghost) {
  border-color:transparent;
  background:transparent;
  box-shadow:none;
  color:var(--body);
}

.live-member :is(.button--quiet,.button--ghost):hover:not(:disabled):not([aria-disabled="true"]) {
  border-color:var(--member-refinement-border);
  background:color-mix(in srgb,var(--accent) 6%,var(--well));
  color:var(--text);
  box-shadow:none;
}

.live-member .button--compact { min-height:44px; padding-inline:11px; font-size:14px; }
.live-member .button--icon,
.live-member .button--icon.button--compact { width:44px; min-width:44px; padding:0; }
.live-member .button--danger { border-color:color-mix(in srgb,#c63858 60%,var(--border)); }

/* Shared surfaces lose the hard black frame while keeping their grouping. */
.live-member .panel,
.live-member .member-startup-shell,
.live-member .loading-surface,
.live-member .availability section {
  border:1px solid var(--member-refinement-border);
  border-radius:14px;
  background:linear-gradient(145deg,var(--card1),var(--card2));
  box-shadow:var(--member-refinement-shadow);
}

.live-member .content {
  width:min(100%,1320px);
  max-width:1320px;
  padding:18px clamp(18px,3.4vw,42px) 32px;
}

.live-member :is(h1,h2) {
  text-transform:none;
  letter-spacing:-.04em;
  line-height:1.04;
}

.live-member h2 { font-size:clamp(28px,3.3vw,42px); }
.live-member .heading { gap:16px; margin-bottom:20px; }
.live-member .heading > div { min-width:0; }
.live-member .eyebrow { letter-spacing:.11em; }

.live-member :is(input,select,textarea) {
  min-height:44px;
  border:1px solid var(--member-refinement-border);
  border-radius:10px;
  background:var(--well);
  box-shadow:inset 0 1px 0 color-mix(in srgb,var(--accent) 4%,transparent);
}

.live-member textarea { padding-block:11px; }

/* Card evidence must remain complete; only the surrounding surface may scale. */
.live-member :is(.discover-result > .discover-result-media > img,.card-thumb,.watch-card-image,.watch-inbox-image,.watch-detail-image,.portfolio-image,.collection-thumb,.collection-rail-image,.ash-insights-card-head img) {
  object-fit:contain;
  object-position:center;
}

@media (max-width:1120px) {
  .live-member .member-nav { justify-content:flex-start; }
}

@media (max-width:700px) {
  .live-member .member-header { min-height:56px; padding-inline:14px; }
  .live-member .member-header > .actions { gap:2px; }
  .live-member .member-header .button--compact { padding-inline:9px; }
  .live-member .member-nav { justify-content:flex-start; margin-bottom:20px; }
  .live-member .content { padding:16px 14px 26px; }
  .live-member .heading { align-items:flex-start; gap:10px; }
  .live-member h2 { font-size:clamp(26px,8vw,36px); }
}

.live-member .collection-import { max-width:880px; margin:20px auto; scroll-margin-top:20px; }
.live-member .collection-import label:has(input[type="checkbox"]) { display:flex; flex-direction:row; align-items:center; gap:10px; min-height:44px; margin-block:16px; }
.live-member .collection-import input[type="checkbox"] { width:20px; height:20px; min-height:20px; padding:0; margin:0; flex:0 0 20px; accent-color:var(--accent, #7426ed); }
.live-member .collection-import li { margin-block:8px; overflow-wrap:anywhere; }
.live-member .collection-import summary { cursor:pointer; min-height:44px; padding-block:12px; }
@media (max-width:390px) {
  .live-member .member-brand img { width:132px; }
  .live-member .member-brand .beta-badge { padding-inline:5px; font-size:8px; }
  .live-member .member-header { gap:6px; }
  .live-member .member-header > .actions { width:auto; margin-left:auto; }
  .live-member .member-header #theme { min-width:44px; padding-inline:10px; font-size:12px; }
  .live-member .member-header #logout { padding-inline:10px; }
  .live-member .member-nav { margin-inline:-2px; padding-inline:2px; }
  .live-member .member-nav button { padding-inline:11px; }
  .live-member :is(button,.button,.button-link) { max-width:100%; }
}