/* SkyHigh Digital A&R — desk.css
   MARKED LAYER: ar-8940-20260911
   Contract: data/ar/AR_CONTRACT.md
   Role: Complete Bid Economy Desk, Deal Negotiation, Sovereign Contracts,
         ONE DOOR Venue Storefront, and Live Talent Appreciation Hub (Before, During, After).
   Theme: Reggae history & sound system culture, sleek, biophilic, high-contrast.
*/

/* Desk Cards & Panels */
.desk-panel {
  background: var(--tile, #121210);
  border: 1px solid var(--seam, #22221f);
  border-radius: 0;
  padding: 24px;
  margin-bottom: 24px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.3);
}

.desk-panel-title {
  font-family: var(--display, "Cabinet Grotesk", sans-serif);
  font-size: 22px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--canvas-gold, #e2a72c);
  margin: 0 0 8px 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.desk-panel-desc {
  font-size: 14px;
  line-height: 1.5;
  color: var(--ash, #8c8c89);
  margin: 0 0 20px 0;
}

/* 4-Role Switcher Tabs */
.role-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 24px;
}

.role-tab, .ar-subnav-btn {
  background: var(--tile, #121210);
  border: 1px solid var(--seam, #22221f);
  color: var(--salt, #f8f8f6);
  font-family: var(--mono, monospace);
  font-size: 13px;
  padding: 10px 18px;
  border-radius: 0;
  cursor: pointer;
  transition: all 0.2s ease;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
}

.role-tab:hover, .ar-subnav-btn:hover {
  border-color: var(--canvas-gold, #e2a72c);
  color: var(--canvas-gold, #e2a72c);
}

.role-tab.active,
.role-tab[aria-selected="true"],
.ar-subnav-btn.active {
  background: rgba(226, 167, 44, 0.12);
  border-color: var(--canvas-gold, #e2a72c);
  color: var(--canvas-gold, #e2a72c);
  font-weight: 700;
}

/* Bid Economy Form & Layout */
.bid-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
  margin-bottom: 24px;
}

.form-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.form-group label {
  font-family: var(--mono, monospace);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--canvas-gold, #e2a72c);
}

.form-control {
  background: #0d0d0b;
  border: 1px solid var(--seam, #22221f);
  color: var(--salt, #f8f8f6);
  font-family: inherit;
  font-size: 14px;
  padding: 10px 14px;
  border-radius: 0;
  outline: none;
  transition: border-color 0.2s ease;
}

.form-control:focus {
  border-color: var(--canvas-gold, #e2a72c);
}

/* Economic Split Breakdown */
.split-ledger {
  background: #090908;
  border: 1px solid var(--seam, #22221f);
  border-radius: 0;
  padding: 18px;
  margin-block: 16px;
}

.split-ledger-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-block: 8px;
  border-bottom: 1px solid rgba(255,255,255,0.05);
  font-family: var(--mono, monospace);
  font-size: 13px;
}

.split-ledger-row:last-child {
  border-bottom: none;
  font-weight: bold;
}

.split-ledger-val.gold { color: var(--canvas-gold, #e2a72c); }
.split-ledger-val.green { color: var(--green-ink, #2fb36d); }
.split-ledger-val.red { color: var(--canvas-red, #dc3545); }

/* Live Appreciation Hub: Before, During, After */
.live-timeline-phases {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 20px;
  margin-block: 28px;
}

.phase-card {
  background: var(--tile, #121210);
  border: 1px solid var(--seam, #22221f);
  border-radius: 0;
  padding: 20px;
  display: flex;
  flex-direction: column;
}

.phase-card.active-phase {
  border-color: var(--canvas-gold, #e2a72c);
  box-shadow: 0 0 16px rgba(226, 167, 44, 0.15);
}

.phase-badge {
  display: inline-block;
  font-family: var(--mono, monospace);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  padding: 4px 10px;
  border-radius: 0;
  margin-bottom: 12px;
  align-self: flex-start;
}

.phase-badge.before {
  background: rgba(226, 167, 44, 0.15);
  color: var(--canvas-gold, #e2a72c);
  border: 1px solid rgba(226, 167, 44, 0.3);
}

.phase-badge.during {
  background: rgba(47, 179, 109, 0.15);
  color: var(--green-ink, #2fb36d);
  border: 1px solid rgba(47, 179, 109, 0.3);
  animation: pulse-border 2s infinite ease-in-out;
}

.phase-badge.after {
  background: rgba(220, 53, 69, 0.15);
  color: #ff6b7b;
  border: 1px solid rgba(220, 53, 69, 0.3);
}

@keyframes pulse-border {
  0%, 100% { border-color: rgba(47, 179, 109, 0.3); }
  50% { border-color: rgba(47, 179, 109, 0.9); }
}

/* Sound System Dub Siren Console */
.dub-siren-console {
  background: #0a0a09;
  border: 2px solid #282824;
  border-radius: 0;
  padding: 18px;
  margin-top: 16px;
}

.siren-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
}

.btn-siren {
  background: #0e0e0c;
  border: 1px solid var(--canvas-gold, #e2a72c);
  color: var(--canvas-gold, #e2a72c);
  font-family: var(--mono, monospace);
  font-size: 13px;
  font-weight: 700;
  padding: 10px 18px;
  border-radius: 0;
  cursor: pointer;
  transition: all 0.15s ease;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.btn-siren:hover {
  background: var(--canvas-gold, #e2a72c);
  color: #000;
}

.btn-siren:active {
  transform: scale(0.96);
}

.btn-siren.btn-rewind {
  border-color: var(--green-ink, #2fb36d);
  color: var(--green-ink, #2fb36d);
}

.btn-siren.btn-rewind:hover {
  background: var(--green-ink, #2fb36d);
  color: #000;
}

/* Live Tip Jar */
.tip-buttons {
  display: flex;
  gap: 8px;
  margin-top: 10px;
}

.tip-btn {
  background: #1a1a18;
  border: 1px solid var(--seam, #22221f);
  color: var(--salt, #f8f8f6);
  font-family: var(--mono, monospace);
  font-size: 12px;
  font-weight: 700;
  padding: 8px 14px;
  border-radius: 0;
  cursor: pointer;
  transition: all 0.2s ease;
}

.tip-btn:hover {
  border-color: var(--green-ink, #2fb36d);
  color: var(--green-ink, #2fb36d);
  background: rgba(47, 179, 109, 0.1);
}

/* Telemetry Level Meter */
.meter-wrap {
  margin-top: 12px;
}

.meter-bar-outer {
  width: 100%;
  height: 10px;
  background: #1a1a18;
  border-radius: 0;
  overflow: hidden;
  border: 1px solid #333;
}

.meter-bar-inner {
  height: 100%;
  width: 68%;
  background: linear-gradient(90deg, #2fb36d 0%, #e2a72c 75%, #dc3545 100%);
  transition: width 0.3s ease;
}

/* Venue Storefront Specs Table */
.specs-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  margin-block: 16px;
}

.specs-table th,
.specs-table td {
  padding: 10px 14px;
  text-align: left;
  border-bottom: 1px solid var(--seam, #22221f);
}

.specs-table th {
  color: var(--ash, #8c8c89);
  font-family: var(--mono, monospace);
  font-weight: 600;
  text-transform: uppercase;
  font-size: 11px;
}

.specs-table td {
  color: var(--salt, #f8f8f6);
}

/* Sharded Country Grid */
.country-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 16px;
  margin-block: 28px;
}

.country-card {
  background: var(--tile, #121210);
  border: 1px solid var(--seam, #22221f);
  border-radius: 0;
  padding: 18px;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: all 0.2s ease;
}

.country-card:hover {
  border-color: var(--canvas-gold, #e2a72c);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}

.country-card-flag {
  font-size: 24px;
  margin-right: 12px;
}

.country-card-info {
  flex: 1;
}

.country-card-name {
  color: var(--salt, #f8f8f6);
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 4px;
}

.country-card-count {
  color: var(--canvas-gold, #e2a72c);
  font-family: var(--mono, monospace);
  font-size: 12px;
}

/* =============================================================
   DIGITAL A&R AUTHENTICATION & MULTI-ROLE MODAL SYSTEM
   ============================================================= */
.ar-auth-slot {
  display: inline-flex;
  align-items: center;
  margin-left: auto;
  padding-left: 12px;
}

.btn-ar-auth {
  background: rgba(226, 167, 44, 0.12);
  border: 1px solid var(--canvas-gold, #e2a72c);
  color: var(--canvas-gold, #e2a72c);
  font-family: var(--mono, monospace);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 6px 14px;
  border-radius: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: all 0.2s ease;
}

.btn-ar-auth:hover {
  background: var(--canvas-gold, #e2a72c);
  color: #090908;
  box-shadow: 0 0 12px rgba(226, 167, 44, 0.4);
}

.auth-user-badge {
  background: #181815;
  border: 1px solid rgba(47, 179, 109, 0.5);
  color: var(--salt, #f8f8f6);
  font-family: var(--mono, monospace);
  font-size: 11px;
  padding: 5px 12px;
  border-radius: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: all 0.2s ease;
}

.auth-user-badge:hover {
  border-color: var(--green-ink, #2fb36d);
  background: rgba(47, 179, 109, 0.15);
}

.auth-pulse {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--green-ink, #2fb36d);
  box-shadow: none;
  animation: authPulse 2s infinite;
}

@keyframes authPulse {
  0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(47, 179, 109, 0.7); }
  70% { transform: scale(1); box-shadow: 0 0 0 6px rgba(47, 179, 109, 0); }
  100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(47, 179, 109, 0); }
}

/* Modal Overlay & Dialog */
.ar-modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.82);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  animation: fadeInModal 0.2s ease-out;
}

@keyframes fadeInModal {
  from { opacity: 0; }
  to { opacity: 1; }
}

.ar-modal-dialog {
  background: linear-gradient(90deg,var(--canvas-red) 0 33.33%,var(--canvas-gold) 33.33% 66.66%,var(--canvas-green) 66.66% 100%) 0 0 / 100% 3px no-repeat, var(--tile, #0d0d0c);
  border: 1px solid var(--seam-strong, #3a3a37);
  border-top: 0;
  padding-top: 3px;
  border-radius: 0;
  width: 100%;
  max-width: 580px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: none;
  display: flex;
  flex-direction: column;
}

.ar-modal-header {
  padding: 20px 24px;
  border-bottom: 1px solid var(--seam, #22221f);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.ar-modal-title {
  font-family: var(--display, "Cabinet Grotesk", sans-serif);
  font-size: 2rem;
  line-height: 0.9;
  font-weight: 800;
  color: var(--salt, #f8f8f6);
  margin: 0;
  text-transform: uppercase;
  letter-spacing: -0.005em;
}

.ar-modal-close {
  background: transparent;
  border: none;
  color: var(--ash, #8c8c89);
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  min-width: 44px;
  min-height: 44px;
  padding: 4px;
  transition: color 0.15s ease;
}

.ar-modal-close:hover {
  color: var(--salt, #f8f8f6);
}

.ar-modal-tabs {
  display: flex;
  border-bottom: 1px solid var(--seam, #22221f);
  background: #090908;
}

.ar-modal-tab {
  flex: 1;
  text-align: center;
  padding: 12px;
  font-family: var(--mono, monospace);
  font-size: 13px;
  font-weight: 600;
  color: var(--ash, #8c8c89);
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  transition: all 0.2s ease;
}

.ar-modal-tab.active {
  color: var(--salt, #f8f8f6);
  border-bottom-color: transparent;
  background: linear-gradient(90deg,var(--canvas-red) 0 33.33%,var(--canvas-gold) 33.33% 66.66%,var(--canvas-green) 66.66% 100%) 0 100% / 100% 2px no-repeat;
}

.ar-modal-body {
  padding: 24px;
}

/* 6-Role Selection Grid in Registration */
.role-picker-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin-bottom: 20px;
}

.role-card {
  background: #141412;
  border: 1px solid var(--seam, #22221f);
  border-radius: 0;
  padding: 12px 14px;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.role-card:hover {
  border-color: rgba(226, 167, 44, 0.4);
}

.role-card.selected {
  background: rgba(226, 167, 44, 0.12);
  border-color: var(--canvas-gold, #e2a72c);
}

.role-card-title {
  font-family: var(--mono, monospace);
  font-size: 13px;
  font-weight: 700;
  color: var(--salt, #f8f8f6);
  display: flex;
  align-items: center;
  gap: 6px;
}

.role-card.selected .role-card-title {
  color: var(--canvas-gold, #e2a72c);
}

.role-card-desc {
  font-size: 11px;
  color: var(--ash, #8c8c89);
  line-height: 1.4;
}

/* User Profile Sheet / Popover */
.profile-meta-box {
  background: #090908;
  border: 1px solid var(--seam, #22221f);
  border-radius: 0;
  padding: 16px;
  margin-bottom: 20px;
}

.profile-meta-row {
  display: flex;
  justify-content: space-between;
  padding-block: 6px;
  font-family: var(--mono, monospace);
  font-size: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.profile-meta-row:last-child {
  border-bottom: none;
}

/* =============================================================
   SUGGESTED MATCHES ENGINE (/ar/suggested/)
   ============================================================= */
.matcher-filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  background: var(--tile, #121210);
  border: 1px solid var(--seam, #22221f);
  border-radius: 0;
  padding: 14px 18px;
  margin-bottom: 24px;
}

.matcher-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 20px;
  margin-block: 24px;
}

.match-card {
  background: var(--tile, #121210);
  border: 1px solid var(--seam, #22221f);
  border-radius: 0;
  padding: 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: all 0.2s ease;
  position: relative;
  overflow: hidden;
}

.match-card:hover {
  border-color: var(--canvas-gold, #e2a72c);
  transform: translateY(-2px);
  box-shadow: none;
}

.match-affinity-pill {
  position: absolute;
  top: 16px;
  right: 16px;
  background: rgba(47, 179, 109, 0.15);
  border: 1px solid var(--green-ink, #2fb36d);
  color: var(--green-ink, #2fb36d);
  font-family: var(--mono, monospace);
  font-size: 11px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 0;
}

.match-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--salt, #f8f8f6);
  margin: 0 0 6px 0;
  padding-right: 70px;
}

.match-location {
  font-family: var(--mono, monospace);
  font-size: 12px;
  color: var(--canvas-gold, #e2a72c);
  margin-bottom: 12px;
}

.match-specs {
  background: #090908;
  border: 1px solid var(--seam, #22221f);
  border-radius: 0;
  padding: 10px 12px;
  font-family: var(--mono, monospace);
  font-size: 11px;
  line-height: 1.6;
  color: var(--ash, #8c8c89);
  margin-bottom: 16px;
}

/* =============================================================
   INTERACTIVE CONTRACT BUILDER & EXPORT
   ============================================================= */
.contract-builder-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-top: 24px;
}

@media (max-width: 900px) {
  .contract-builder-grid {
    grid-template-columns: 1fr;
  }
}

.contract-parchment {
  background: #090908;
  border: 2px solid var(--canvas-gold, #e2a72c);
  border-radius: 0;
  padding: 32px;
  box-shadow: none;
  position: relative;
  font-family: Georgia, serif;
  color: #e6e6e2;
  line-height: 1.6;
}

.contract-seal {
  position: absolute;
  top: 24px;
  right: 24px;
  width: 70px;
  height: 70px;
  border: 2px dashed var(--canvas-gold, #e2a72c);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mono, monospace);
  font-size: 9px;
  font-weight: 700;
  color: var(--canvas-gold, #e2a72c);
  text-align: center;
  text-transform: uppercase;
  transform: rotate(-12deg);
}

.contract-header-text {
  text-align: center;
  border-bottom: 2px solid var(--canvas-gold, #e2a72c);
  padding-bottom: 16px;
  margin-bottom: 24px;
}

.contract-parties {
  background: rgba(226, 167, 44, 0.05);
  border: 1px solid rgba(226, 167, 44, 0.2);
  padding: 14px;
  border-radius: 0;
  margin-bottom: 20px;
  font-size: 13px;
}

.contract-signatures {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  margin-top: 36px;
  padding-top: 24px;
  border-top: 1px solid #333;
}

.sign-line {
  border-bottom: 1px solid var(--ash, #8c8c89);
  height: 36px;
  margin-bottom: 6px;
  display: flex;
  align-items: flex-end;
  font-family: "Brush Script MT", cursive, sans-serif;
  font-size: 20px;
  color: var(--canvas-gold, #e2a72c);
}

/* Print styles for contracts */
@media print {
  body * {
    visibility: hidden;
  }
  .contract-parchment, .contract-parchment * {
    visibility: visible;
  }
  .contract-parchment {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    background: #fff !important;
    color: #000 !important;
    border: 2px solid #000 !important;
  }
}
/* ==========================================================================================
   MARKED LAYER hub-v6-20260913 pages-client — v6 HUB styles, APPENDED (desk.css not rewritten).
   Mobile 390: the subnav and every table scroll INSIDE their own box; the page never scrolls sideways.
   ========================================================================================== */
.ar-authbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:8px 16px;font-size:14px;
  border-bottom:1px solid rgba(255,255,255,.12)}
.ar-authbar__who{opacity:.85}
.ar-authbar__link{text-decoration:underline}
.ar-subnav{border-bottom:1px solid rgba(255,255,255,.12);max-width:100%}
.ar-subnav__scroll{display:flex;gap:14px;overflow-x:auto;white-space:nowrap;padding:8px 16px;
  -webkit-overflow-scrolling:touch;scrollbar-width:thin}
.ar-subnav__link{font-size:13px;letter-spacing:.03em;text-transform:uppercase;opacity:.8;flex:0 0 auto}
.ar-subnav__link[aria-current="page"]{opacity:1;text-decoration:underline}
.ar-section{padding:28px 16px;max-width:1080px;margin:0 auto}
.ar-h1{font-size:clamp(26px,5vw,44px);line-height:1.1;margin:0 0 10px}
.ar-h2{font-size:clamp(20px,3.4vw,30px);margin:0 0 8px}
.ar-lede{max-width:66ch;opacity:.9;margin:0 0 14px}
.ar-meta{font-size:13px;opacity:.72;margin:6px 0;max-width:72ch}
.ar-money-line{font-weight:600;opacity:.95}
.ar-doors{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.ar-door{display:flex;flex-direction:column;gap:6px;padding:18px;border:1px solid rgba(255,255,255,.16);
  border-radius: 0;text-decoration:none}
.ar-door:hover,.ar-door:focus-visible{border-color:currentColor}
.ar-door__name{font-size:20px;font-weight:700}
.ar-door__line{font-size:14px;opacity:.8}
.ar-steps,.ar-rules{max-width:70ch;padding-left:1.2em;line-height:1.55}
.ar-steps li,.ar-rules li{margin:6px 0}
.ar-lessons{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));align-items:start}
.ar-lesson{border:1px solid rgba(255,255,255,.14);border-radius: 0;padding:14px;display:flex;
  flex-direction:column;gap:8px}
.ar-lesson__img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius: 0;display:block}
.ar-lesson__title{font-size:18px;margin:0}
.ar-lesson__era{font-size:12px;text-transform:uppercase;letter-spacing:.05em;opacity:.6;margin:0}
.ar-lesson__quote{margin:0;padding-left:12px;border-left:3px solid currentColor;opacity:.85;font-style:italic}
.ar-chapters{padding-left:1.2em}
.ar-chapter{margin:8px 0}
.ar-chapter__t{font-weight:600;display:block}
.ar-chapter__p{font-size:14px;opacity:.8}
.ar-event-list,.ar-route__stops,.ar-market__list,.ar-directory__list,.ar-sponsor-rooms__list{
  list-style:none;padding:0;margin:12px 0;display:grid;gap:10px}
.ar-event,.ar-route__stop,.ar-market__row,.ar-directory__row,.ar-sponsor-room{
  display:flex;flex-wrap:wrap;gap:8px 16px;align-items:baseline;padding:10px 12px;
  border:1px solid rgba(255,255,255,.12);border-radius: 0}
.ar-event__when,.ar-route__when,.ar-market__date{font-variant-numeric:tabular-nums;opacity:.8;font-size:14px}
.ar-event__title,.ar-route__where{font-weight:600}
.ar-spot-grid{list-style:none;padding:0;margin:12px 0;display:grid;gap:8px;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,120px),1fr))}
.ar-spot{border:1px dashed rgba(255,255,255,.22);border-radius: 0;padding:10px;font-size:12px;
  display:flex;flex-direction:column;gap:4px}
.ar-spot__n{font-size:18px;font-weight:700}
.ar-ledger{display:grid;grid-template-columns:minmax(10rem,15rem) minmax(0,1fr);gap:0 24px;max-width:760px;margin:12px 0;border-top:1px solid var(--seam)}
.ar-ledger dt,.ar-ledger dd{margin:0;padding:10px 0;border-bottom:1px solid var(--seam)}
.ar-ledger dt{font:400 .72rem/1.5 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--canvas-gold)}
.ar-ledger dd{text-align:left;font-variant-numeric:tabular-nums}
.ar-btn[hidden]{display:none}
.ar-table-wrap{overflow-x:auto;max-width:100%}
.ar-table{border-collapse:collapse;min-width:560px;width:100%;font-size:14px}
.ar-table th,.ar-table td{border-bottom:1px solid rgba(255,255,255,.12);padding:8px 10px;text-align:left}
.ar-table td{font-variant-numeric:tabular-nums}
.ar-chips{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.ar-chip{border:1px solid rgba(255,255,255,.2);border-radius: 0;padding:6px 14px;font-size:13px;
  background:transparent;color:inherit;cursor:pointer}
.ar-chip[aria-pressed="true"]{border-color:currentColor;font-weight:600}
/* MARKED LAYER hub-brand-56 modals-feedback (2026-09-14) — the v6 rounded form/button/modal rules, rewritten in place.
   ROUND2-BRIEF paper palette (0c, 2026-09-13) refuted by owner 2026-09-14: THE ART OF THE DIGITAL A&R IS OFF BRAND, FIX THAT.
   One dark look: tile panel under a 3px red|gold|green rule, zero radius, zero shadow, Big Shoulders title, DM Mono labels,
   void fields with a gold focus ring, red action. <=600px the panel is a bottom sheet. Submit marks are drawn off
   motion.js's data-state (busy | done | fail): the M2 45-adapter turns at 45 rpm (0.75 turn/s), static under reduced motion. */
:root{
  --ar-adapter:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000'%3E%3Ccircle cx='12' cy='12' r='10' stroke-width='2'/%3E%3Ccircle cx='12' cy='12' r='3.6' stroke-width='2.4'/%3E%3Cpath d='M12 8.4V2.5M15.1 13.8l5.1 2.95M8.9 13.8l-5.1 2.95' stroke-width='3.6'/%3E%3C/svg%3E");
  --ar-i-check:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6'%3E%3Cpath d='M4 12.5l5 5L20 6.5'/%3E%3C/svg%3E");
  --ar-i-alert:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M12 2.8L22.4 21H1.6Z'/%3E%3Cpath d='M12 9v6M12 16.6v2.2' stroke-width='2.4'/%3E%3C/svg%3E");
}
.ar-form{display:grid;gap:14px;max-width:460px}
.ar-form label{display:grid;gap:6px;font-size:14px}
.ar-form label:not(.ar-check,.ar-radio),.ar-form legend{font:400 .68rem/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ash)}
.ar-form :is(input,select,textarea){font:400 16px/1.4 var(--body);letter-spacing:normal;text-transform:none;color-scheme:dark}
.ar-form label.ar-check{display:flex;align-items:center;gap:12px;min-height:44px}
body[data-hub-layer] .ar-form :is(input[type="checkbox"],input[type="radio"]),.ar-form :is(input[type="checkbox"],input[type="radio"]){-webkit-appearance:none;appearance:none;flex:0 0 auto;width:20px;height:20px;min-height:0;margin:0;padding:0;border:1px solid var(--seam-strong);background:var(--void);cursor:pointer}
.ar-form input[type="radio"]{border-radius:50%}
.ar-form input[type="checkbox"]:checked{border-color:var(--canvas-gold);background:linear-gradient(var(--canvas-gold),var(--canvas-gold)) center/10px 10px no-repeat,var(--void)}
.ar-form input[type="radio"]:checked{border-color:var(--canvas-gold);background:radial-gradient(circle,var(--canvas-gold) 0 4px,var(--void) 5px)}
.ar-form :is(input[type="checkbox"],input[type="radio"]):focus-visible{outline:2px solid var(--canvas-gold);outline-offset:2px}
body[data-hub-layer] form.ar-form select,form.ar-form select{-webkit-appearance:none;appearance:none;padding-right:44px;background-color:var(--void);background-image:linear-gradient(45deg,transparent 50%,var(--ash) 50%),linear-gradient(135deg,var(--ash) 50%,transparent 50%);background-position:calc(100% - 22px) 50%,calc(100% - 16px) 50%;background-size:6px 6px;background-repeat:no-repeat}
.ar-form input,.ar-form select,.ar-form textarea{width:100%;max-width:100%;box-sizing:border-box;
  padding:10px 12px;border-radius:0;border:1px solid var(--seam-strong);background:var(--void);color:var(--salt)}
.ar-form__error{color:var(--red-ink);font-size:14px}
.ar-form__ok{font-size:14px}
.ar-check{display:flex;flex-direction:row;align-items:center;gap:8px}
.ar-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 18px;border-radius:0;
  border:1px solid var(--canvas-red);background:transparent;color:var(--salt);font:400 .78rem/1.2 var(--body);
  letter-spacing:.14em;text-transform:uppercase;cursor:pointer;text-decoration:none;
  transition:background-color .2s var(--ease-arrive),border-color .2s var(--ease-arrive),color .2s var(--ease-arrive)}
.ar-btn:hover,.ar-btn:active{background:var(--canvas-red);border-color:var(--canvas-red);color:var(--salt)}
.ar-btn:focus-visible{outline:2px solid var(--canvas-gold);outline-offset:3px}
.ar-btn--ghost{border-color:var(--seam-strong)}
.ar-btn[disabled],.ar-btn[disabled]:hover{background:transparent;border-color:var(--seam);color:var(--ash);cursor:not-allowed}
/* submit feedback: the mark sits before the word; motion.js writes the word */
.ar-btn:is([data-state="busy"],[data-state="done"],[data-state="fail"])::before{content:"";flex:0 0 18px;height:18px;
  background:currentColor;-webkit-mask:var(--ar-adapter) center/contain no-repeat;mask:var(--ar-adapter) center/contain no-repeat}
.ar-btn[data-state="busy"],.ar-btn[data-state="busy"][disabled]{cursor:progress;color:var(--salt);border-color:var(--canvas-red);background:transparent}
.ar-btn[data-state="busy"]::before{color:var(--canvas-gold);animation:ar-fb-spin 1.333s linear infinite}
.ar-btn[data-state="done"]{border-color:var(--green-ink);background:transparent}
.ar-btn[data-state="done"]::before{color:var(--green-ink);-webkit-mask-image:var(--ar-i-check);mask-image:var(--ar-i-check)}
.ar-btn[data-state="fail"]{border-color:var(--red-ink);background:transparent}
.ar-btn[data-state="fail"]::before{color:var(--red-ink);-webkit-mask-image:var(--ar-i-alert);mask-image:var(--ar-i-alert)}
:is(body[data-hub-layer] .ar-modal,.ar-modal,body) .ar-btn:is([data-state="busy"],[data-state="done"],[data-state="fail"]):is(:hover,:active,:focus-visible){background-color:transparent;color:var(--salt);transform:none}
:is(body[data-hub-layer] .ar-modal,.ar-modal,body) .ar-btn[disabled]:not([data-state="busy"]){background:transparent;border-color:var(--seam);color:var(--ash);cursor:not-allowed}
:is(body[data-hub-layer] .ar-modal,.ar-modal,body) .ar-btn[data-state="done"]{border-color:var(--green-ink)}
:is(body[data-hub-layer] .ar-modal,.ar-modal,body) .ar-btn[data-state="fail"]{border-color:var(--red-ink)}
.ar-modal[hidden],.ar-modal [hidden]{display:none!important}
.ar-modal{position:fixed;inset:0;z-index:900;display:flex;align-items:center;justify-content:center;padding:16px}
.ar-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.82);animation:ar-fb-fade .2s var(--ease-arrive) both}
.ar-modal__panel{position:relative;width:100%;max-width:560px;max-height:88vh;max-height:88dvh;overflow-y:auto;
  overscroll-behavior:contain;box-sizing:border-box;padding:30px 28px 26px;border:1px solid var(--seam-strong);border-top:0;
  border-radius:0;box-shadow:none;color:var(--salt);font:300 15px/1.6 var(--body);
  background:linear-gradient(90deg,var(--canvas-red) 0 33.33%,var(--canvas-gold) 33.33% 66.66%,var(--canvas-green) 66.66% 100%) 0 0/100% 3px no-repeat,var(--tile);animation:ar-fb-lift .24s var(--ease-arrive) both}
.ar-modal__title{margin:0 72px 20px 0;font:800 2.2rem/.9 var(--display);letter-spacing:-.005em;text-transform:uppercase;color:var(--salt)}
.ar-modal__title::before{content:"";display:block;width:22px;height:22px;margin:0 0 14px;background:var(--canvas-gold);
  -webkit-mask:var(--ar-adapter) center/contain no-repeat;mask:var(--ar-adapter) center/contain no-repeat}
.ar-modal__tabs{display:flex;gap:0;flex-wrap:nowrap;overflow-x:auto;margin:0 0 22px;border-bottom:1px solid var(--seam)}
.ar-modal__tab{flex:1 0 auto;min-height:44px;margin:0 0 -1px;padding:12px 10px;border:0;border-radius:0;background:transparent;
  color:var(--ash);font:400 .68rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;
  transition:color .2s var(--ease-arrive)}
.ar-modal__tab:hover,.ar-modal__tab:focus-visible{color:var(--salt);border:0}
.ar-modal__tab[aria-selected="true"],.ar-modal__tab.active{color:var(--salt);font-weight:400;background:linear-gradient(90deg,var(--canvas-red) 0 33.33%,var(--canvas-gold) 33.33% 66.66%,var(--canvas-green) 66.66% 100%) 0 100%/100% 2px no-repeat}
.ar-modal .ar-form{max-width:none;gap:16px}
.ar-modal .ar-form label,.ar-modal .ar-form legend{font:400 .68rem/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ash)}
.ar-modal .ar-form :is(input,select,textarea){min-height:46px;padding:12px 14px;border:1px solid var(--seam-strong);border-radius:0;
  background-color:var(--void);color:var(--salt);font:400 16px/1.4 var(--body);letter-spacing:normal;text-transform:none;color-scheme:dark}
.ar-modal .ar-form textarea{min-height:92px;resize:vertical}
.ar-modal .ar-form select{-webkit-appearance:none;appearance:none;padding-right:44px;
  background-image:linear-gradient(45deg,transparent 50%,var(--ash) 50%),linear-gradient(135deg,var(--ash) 50%,transparent 50%);
  background-position:calc(100% - 22px) 50%,calc(100% - 16px) 50%;background-size:6px 6px;background-repeat:no-repeat}
.ar-modal .ar-form select option{background:var(--tile);color:var(--salt)}
.ar-modal .ar-form :is(input,select,textarea):hover{border-color:var(--ash)}
.ar-modal .ar-form :is(input,select,textarea):focus-visible{outline:2px solid var(--canvas-gold);outline-offset:2px;border-color:var(--canvas-gold)}
.ar-modal .ar-form :is(input[type="radio"],input[type="checkbox"]){min-height:0;width:18px;height:18px;margin:0;padding:0;accent-color:var(--canvas-gold)}
.ar-modal .ar-form__set{border:1px solid var(--seam);padding:10px 14px 6px;margin:0;display:grid}
.ar-modal .ar-form label.ar-radio{display:flex;align-items:center;gap:12px;min-height:44px;font:400 .95rem/1 var(--body);
  letter-spacing:normal;text-transform:none;color:var(--salt);cursor:pointer}
.ar-modal .ar-meta{margin:14px 0;max-width:none;font:400 .74rem/1.65 var(--mono);letter-spacing:.02em;color:var(--ash);opacity:1}
.ar-modal .ar-form button[type="submit"]{width:100%;min-height:50px;margin-top:4px;padding:15px 18px}
.ar-modal .ar-btn--ghost{width:100%;min-height:48px;margin-top:12px}
.ar-modal :is(.ar-form__error,.ar-form__ok){display:flex;align-items:flex-start;gap:10px;margin:0;padding:2px 0 2px 12px;
  font:400 .8rem/1.55 var(--mono);color:var(--salt);border-left:2px solid var(--red-ink)}
.ar-modal .ar-form__ok{border-left-color:var(--green-ink)}
.ar-modal :is(.ar-form__error,.ar-form__ok)::before{content:"";flex:0 0 16px;height:16px;margin-top:2px;color:var(--red-ink);
  background:currentColor;-webkit-mask:var(--ar-i-alert) center/contain no-repeat;mask:var(--ar-i-alert) center/contain no-repeat}
.ar-modal .ar-form__ok::before{color:var(--green-ink);-webkit-mask-image:var(--ar-i-check);mask-image:var(--ar-i-check)}
.ar-modal__close{position:absolute;top:14px;right:14px;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-width:44px;min-height:44px;padding:0 10px;border:1px solid var(--seam);border-radius:0;background:transparent;color:var(--ash);
  font:300 22px/1 var(--body);cursor:pointer;transition:color .2s var(--ease-arrive),border-color .2s var(--ease-arrive)}
.ar-modal__close::before{content:"Esc";font:400 .66rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase}
.ar-modal__close:hover,.ar-modal__close:focus-visible{color:var(--salt);border-color:var(--canvas-red)}
.ar-modal__close:focus-visible{outline:2px solid var(--canvas-gold);outline-offset:2px}
@media (hover:none),(pointer:coarse){.ar-modal__close::before{content:none}}
@keyframes ar-fb-lift{from{opacity:0;transform:translateY(12px)}}
@keyframes ar-fb-fade{from{opacity:0}}
@keyframes ar-fb-spin{to{transform:rotate(1turn)}}
@media (max-width:600px){
  .ar-modal{align-items:flex-end;padding:0}
  .ar-modal__panel{max-width:100%;max-height:92vh;max-height:92dvh;padding:40px 16px 0;
    border-left:0;border-right:0;border-bottom:0;
    background:linear-gradient(90deg,var(--canvas-red) 0 33.33%,var(--canvas-gold) 33.33% 66.66%,var(--canvas-green) 66.66% 100%) 0 0/100% 3px no-repeat,linear-gradient(var(--seam-strong),var(--seam-strong)) 50% 14px/44px 6px no-repeat,var(--tile)}
  .ar-modal__title{margin-right:56px;font-size:1.9rem}
  .ar-modal__close{top:26px;right:12px}
  .ar-modal .ar-form button[type="submit"]{position:sticky;bottom:0;z-index:1;background-color:var(--tile);
    box-sizing:border-box;min-height:calc(50px + env(safe-area-inset-bottom));padding-bottom:calc(15px + env(safe-area-inset-bottom))}
  .ar-modal__panel::after{content:"";display:block;height:calc(16px + env(safe-area-inset-bottom))}
  .ar-modal .ar-form button[type="submit"]:is(:hover,:active){background-color:var(--canvas-red)}
  .ar-modal .ar-form button[type="submit"]:is([data-state="busy"],[data-state="done"],[data-state="fail"],[disabled]){background-color:var(--tile)}
}
@media (prefers-reduced-motion:reduce){
  .ar-modal__panel,.ar-modal__backdrop,.ar-btn[data-state="busy"]::before{animation:none}
}
html.ar-modal-open{overflow:hidden}
@media (max-width:430px){
  .ar-section{padding:22px 16px}
  .ar-ledger{grid-template-columns:minmax(0,1fr)}
  .ar-ledger dt{padding-bottom:2px;border-bottom:0}
  .ar-ledger dd{padding-top:0}
}

/* MARKED LAYER hub-v6-20260913 fix — 390x844 no-overflow guard.
   test_ar_e2e.mjs reported scrollWidth 465-540 vs innerWidth 390 on 8 page families;
   the named culprits were #ar-auth-slot (margin-left:auto, no wrap) and .ar-subnav__link
   (a nowrap row whose scroller was not clamped to the viewport). Fixed at the culprits,
   with a body clamp as the belt. The subnav stays horizontally scrollable by intent. */
@media (max-width: 600px) {
  html, body { max-width: 100%; overflow-x: hidden; }
  .ar-subnav { overflow: hidden; max-width: 100vw; }
  .ar-subnav__scroll { max-width: 100%; padding-inline: 12px; }
  .ar-authbar { flex-wrap: wrap; row-gap: 6px; padding-inline: 12px; }
  .ar-auth-slot, #ar-auth-slot { margin-left: 0; max-width: 100%; flex-wrap: wrap; }
  .ar-section { padding-inline: 12px; }
  .ar-wrap { max-width: 100%; padding-inline: 12px; box-sizing: border-box; }
  img, table, pre, iframe, .ar-map { max-width: 100%; }
  .ar-spot-grid, .ar-lessons, .ar-card-actions { max-width: 100%; }
  .contract-builder-grid, .desk-panel, .contract-parchment { max-width: 100%; box-sizing: border-box; min-width: 0; }
  .desk-panel, .contract-parchment { padding: 16px; }
  .bid-grid { grid-template-columns: 1fr !important; }
}

/* MARKED LAYER hub-v6-20260913 fix — the measured culprit, second pass.
   test_ar_e2e named #ar-auth-slot / #btn-open-auth at x=465 on a 390px viewport: the slot sits
   in header.masthead's flex row (site/ar/*.html line 24) next to the wordmark, toggle and .nav,
   and that row did not wrap. The subnav links at 395-532 are inside .ar-subnav__scroll and never
   drove scrollWidth (465 < 532) — the masthead did. Scoped to assets/ar/desk.css, i.e. /ar/ pages. */
@media (max-width: 600px) {
  .masthead { flex-wrap: wrap; max-width: 100%; box-sizing: border-box; }
  .masthead .nav { min-width: 0; max-width: 100%; }
  #ar-auth-slot, .ar-auth-slot { margin-left: 0; padding-left: 0; min-width: 0;
    flex: 1 1 100%; justify-content: flex-start; }
  #btn-open-auth, .btn-ar-auth, .auth-user-badge { max-width: 100%; white-space: normal; }
}