





.groundDots {
  position: relative;
  isolation: isolate;
}

.groundDots::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: radial-gradient(
    color-mix(in srgb, var(--i-ink-1) 7%, transparent) 1px, transparent 1px);
  background-size: 26px 26px;
  background-position: -1px -1px;
  -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 46%, rgba(0, 0, 0, 0) 100%);
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 46%, rgba(0, 0, 0, 0) 100%);
}


.groundEdge { border-bottom: 1px solid var(--i-hair); }



.brandMark { flex: 0 0 auto; display: block; overflow: visible; }
.brandMarkRing { fill: none; stroke: var(--i-orchid); stroke-width: 5; }
.brandMarkCore { fill: var(--i-orchid); }


.brandLockup {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  color: inherit;
}
.brandLockupText {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
.brandLockupName {
  font-family: var(--oo-font-data);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.22em;
  line-height: 1;
  color: var(--i-ink-1);
}
.brandLockupSub {
  font-family: var(--oo-font-data);
  font-size: 9.5px;
  font-weight: 400;
  letter-spacing: 0.34em;
  line-height: 1;
  color: var(--i-ink-3);
}



.artFrame {
  display: block;
  width: 100%;
  height: auto;
  max-width: 208px;
  overflow: visible;
}


.artFrame .artRule {
  stroke: var(--i-hair);
  stroke-width: 1;
}


.artFrame .artLine {
  stroke: var(--i-ink-3);
  stroke-width: 1.5;
  stroke-linecap: round;
}


.artFrame .artEdge {
  stroke: var(--i-ink-2);
  stroke-width: 1.5;
  stroke-linecap: butt;
}


.artFrame .artMark { fill: var(--i-orchid); }

.artFrame .artNode {
  fill: none;
  stroke: var(--i-ink-3);
  stroke-width: 1.5;
}


.artFrame .artStrand {
  stroke: var(--i-ink-3);
  stroke-width: 1.25;
  stroke-linecap: round;
}
.artFrame .artStrandFaint {
  stroke: var(--i-ink-4);
  stroke-width: 1;
  stroke-linecap: round;
}


.artFrame .artBodyUp { fill: var(--i-bull-wash); stroke: var(--i-bull); stroke-width: 1; }
.artFrame .artBodyDown { fill: var(--i-bear-wash); stroke: var(--i-bear); stroke-width: 1; }
.artFrame .artBodyEmpty {
  fill: none;
  stroke: var(--i-ink-4);
  stroke-width: 1;
  stroke-dasharray: 3 3;
}



.perrMain {
  display: flex;
  flex-direction: column;
  max-width: 860px;
}

.perrWrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  min-height: 54vh;
  justify-content: center;
  padding: 24px 0 40px;
}

.perrArt { margin-bottom: 26px; opacity: 0.92; }


.perrCode {
  font-family: var(--oo-font-data);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.18em;
  line-height: 1;
  color: var(--i-orchid-bright);
  border: 1px solid color-mix(in srgb, var(--i-orchid) 38%, transparent);
  background: var(--i-orchid-wash);
  border-radius: var(--i-r-pill);
  padding: 5px 12px;
  margin-bottom: 18px;
}
.perrCode[data-len="7"] { letter-spacing: 0.14em; }

.perrTitle {
  margin: 0 0 14px;
  font-size: clamp(26px, 4.2vw, 38px) !important;
  line-height: 1.1;
  letter-spacing: -0.026em;
  font-weight: 600;
  color: var(--i-ink-1);
  text-wrap: balance;
}

.perrLede {
  margin: 0 0 20px !important;
  max-width: 62ch;
  font-size: var(--i-t-md) !important;
  line-height: 1.62;
  color: var(--i-ink-2) !important;
}



.perrPath {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
  margin: 0 0 6px !important;
  padding: 9px 13px;
  border: 1px solid var(--i-hair);
  border-left: 2px solid var(--i-ink-4);
  border-radius: var(--i-r-chip);
  background: var(--i-field-bg);
  max-width: 100%;
}
.perrPathLabel {
  font-size: var(--i-t-xs);
  letter-spacing: var(--i-track-label);
  text-transform: uppercase;
  color: var(--i-ink-3);
  flex: 0 0 auto;
}
.perrPathValue {
  font-family: var(--oo-font-data);
  font-size: var(--i-t-body);
  color: var(--i-ink-1);
  overflow-wrap: anywhere;
  min-width: 0;
}



.perrProbeHost { margin-bottom: 6px; max-width: 62ch; }
.perrProbe {
  display: block;
  font-size: var(--i-t-sm);
  line-height: 1.55;
  color: var(--i-ink-3);
  padding-left: 13px;
  border-left: 2px solid var(--i-ink-4);
}
.perrProbe[data-tone="up"] { border-left-color: var(--i-bull); color: var(--i-ink-2); }
.perrProbe[data-tone="down"] { border-left-color: var(--i-bear); color: var(--i-ink-2); }




.perrActions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr));
  gap: 12px;
  width: 100%;
  margin-top: 22px;
}

.perrActionCell {
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-width: 0;
}

.perrAction {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 10px 18px;
  border: 1px solid var(--i-hair-strong);
  border-radius: var(--i-r-control);
  background: var(--i-control-bg);
  color: var(--i-ink-1);
  font-family: inherit;
  font-size: var(--i-t-body);
  font-weight: 500;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  transition: background var(--i-dur-fast) var(--i-ease-out),
              border-color var(--i-dur-fast) var(--i-ease-out);
}
.perrAction:hover {
  background: var(--i-control-bg-hover);
  border-color: var(--i-accent-edge-soft);
}
.perrAction.primary {
  background: var(--i-gradient-primary);
  border-color: var(--i-accent-edge);
  color: var(--i-ink-on-accent);
  box-shadow: var(--i-btn-primary-shadow);
}
.perrAction.primary:hover { box-shadow: var(--i-btn-primary-shadow-hover); }


.perrAction:focus-visible {
  outline: var(--focus-ring);
  outline-offset: var(--focus-ring-offset);
}

.perrActionNote {
  font-size: 11px;
  line-height: 1.45;
  color: var(--i-ink-3);
  padding: 0 2px;
}



.perrAside {
  margin: 20px 0 0 !important;
  font-size: var(--i-t-sm) !important;
  color: var(--i-ink-3) !important;
  max-width: 62ch;
}
.perrAsideLink { color: var(--i-orchid-bright); text-decoration: underline; text-underline-offset: 2px; }
.perrAsideLink:hover { color: var(--i-ink-1); }
.perrAsideLink:focus-visible { outline: var(--focus-ring); outline-offset: var(--focus-ring-offset); }



@media (prefers-reduced-motion: reduce) {
  .perrAction { transition: none; }
}
:root[data-motion="reduced"] .perrAction { transition: none; }



@media (max-width: 767px) {
  .perrWrap { min-height: 0; padding: 8px 0 32px; }
  .perrArt { margin-bottom: 20px; }
  .perrArt .artFrame { max-width: 168px; }
  .perrActions { grid-template-columns: minmax(0, 1fr); }
  .perrAction { width: 100%; }
}






@media (max-width: 767px) {
  :root {
    
    --mobNavH: 54px;
    --mobSafeB: env(safe-area-inset-bottom, 0px);
    --mobSafeT: env(safe-area-inset-top, 0px);
    --mobNavTotal: calc(var(--mobNavH) + var(--mobSafeB));

    
    --mobSheetPeek: 108px;
    --mobSheetOpen: 78vh;

    
    --mobTap: 44px;

    --mobGutter: 16px;
  }

  
  html, body {
    max-width: 100%;
    overflow-x: clip;
  }

  
  input[type="text"], input[type="search"], input[type="email"],
  input[type="password"], input[type="number"], input:not([type]),
  select, textarea {
    font-size: max(16px, 1em);
  }

  
  #app-root button,
  #app-root [role="button"],
  #app-root summary,
  #app-root select {
    min-height: var(--mobTap);
  }
}



@media (max-width: 767px) {
  #app-root.pk-page .pk-nav {
    position: fixed !important;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 60;
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 0 var(--mobSafeB) !important;
    width: auto !important;
    border: 0;
    border-top: 1px solid var(--i-hair);
    border-radius: 0 !important;
    background: var(--mobChromeBg);
    -webkit-backdrop-filter: blur(14px) saturate(1.3);
    backdrop-filter: blur(14px) saturate(1.3);
    box-shadow: 0 -1px 0 0 var(--i-hair), var(--i-elev-3);
  }

  #app-root.pk-page .pk-nav-link {
    flex: 1 1 0 !important;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    
    justify-content: center !important;
    gap: 3px;
    min-width: 0;
    min-height: var(--mobNavH);
    padding: 6px 4px !important;
    border-radius: 0 !important;
    background: none !important;
    font-size: 10.5px !important;
    line-height: 1.1;
    letter-spacing: 0.02em;
    text-align: center;
    color: var(--i-ink-3) !important;
    
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  
  #app-root.pk-page .pk-nav-link.active,
  #app-root.pk-page .pk-nav-link[aria-current="page"] {
    color: var(--i-ink-1) !important;
    box-shadow: inset 0 2px 0 0 var(--i-orchid);
  }

  #app-root.pk-page .pk-nav-link:active {
    background: var(--i-nav-hover) !important;
  }

  
  #app-root.pk-page .pk-nav-burger { display: none !important; }

  
  #app-root.pk-page .pk-masthead {
    padding: 10px var(--mobGutter) calc(10px + var(--mobSafeT)) !important;
    gap: 10px;
    flex-wrap: nowrap;
  }
  #app-root.pk-page .pk-cta-button {
    margin-left: auto;
    white-space: nowrap;
    font-size: var(--i-t-sm) !important;
    padding: 8px 14px !important;
  }

  
  #app-root.pk-page { padding-bottom: var(--mobNavTotal); }
  #app-root.pk-page .pk-footer { margin-bottom: 8px; }

  
  #app-root .pk-skip-inline:focus { top: calc(12px + var(--mobSafeT)); }
}



@media (max-width: 767px) {
  #app-root.app-root {
    display: block !important;
    padding-bottom: calc(var(--mobSheetPeek) + var(--mobSafeB));
  }

  #app-root .terminal-viewport {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding-left: var(--mobGutter) !important;
    padding-right: var(--mobGutter) !important;
  }

  #app-root #singularity-sidebar {
    position: fixed !important;
    left: 0;
    right: 0;
    bottom: 0;
    top: auto !important;
    z-index: 70;
    width: auto !important;
    max-width: 100% !important;
    height: calc(var(--mobSheetPeek) + var(--mobSafeB)) !important;
    max-height: calc(var(--mobSheetOpen) + var(--mobSafeB));
    padding: 0 var(--mobGutter) var(--mobSafeB) !important;
    border: 0 !important;
    border-top: 1px solid var(--i-hair-strong) !important;
    border-radius: var(--i-r-panel) var(--i-r-panel) 0 0 !important;
    background: var(--mobChromeBg) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.3);
    backdrop-filter: blur(16px) saturate(1.3);
    box-shadow: 0 -8px 28px rgba(0, 0, 0, 0.45);
    overflow: hidden !important;
    transition: height var(--m-panel, 200ms) var(--m-ease, ease);
  }

  
  #app-root #singularity-sidebar::before {
    content: "";
    display: block;
    width: 36px;
    height: 4px;
    margin: 8px auto 6px;
    border-radius: var(--i-r-pill);
    background: var(--i-ink-4);
    flex: none;
  }

  #app-root #singularity-sidebar:focus-within,
  #app-root #singularity-sidebar[data-mobsheet="open"] {
    height: calc(var(--mobSheetOpen) + var(--mobSafeB)) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
  }

  
  #app-root #singularity-sidebar .sidebar-brand { display: none !important; }
  #app-root #singularity-sidebar .sidebar-nav,
  #app-root #singularity-sidebar .oo-nav-filter {
    display: none !important;
  }
  #app-root #singularity-sidebar:focus-within .sidebar-nav,
  #app-root #singularity-sidebar[data-mobsheet="open"] .sidebar-nav {
    display: block !important;
    padding-bottom: 24px;
  }
  #app-root #singularity-sidebar:focus-within .oo-nav-filter,
  #app-root #singularity-sidebar[data-mobsheet="open"] .oo-nav-filter {
    display: flex !important;
  }

  
  #app-root #singularity-sidebar .sidebar-field {
    min-height: var(--mobTap);
    margin-bottom: 8px !important;
  }
  #app-root #singularity-sidebar .ticker-shell {
    display: inline-flex !important;
    width: 34% !important;
    margin-right: 2% !important;
  }
  #app-root #singularity-sidebar .command-shell {
    display: inline-flex !important;
    width: 64% !important;
  }

  
  #app-root #singularity-sidebar .sidebar-nav a,
  #app-root #singularity-sidebar .sidebar-nav button {
    min-height: var(--mobTap);
    display: flex;
    align-items: center;
  }
}



@media (max-width: 767px) {
  #app-root [class*="Grid"],
  #app-root [class*="-grid"],
  #app-root [class*="Cards"],
  #app-root [class*="-cards"],
  #app-root [class*="-columns"] {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px;
  }

  
  #app-root [class*="-row"],
  #app-root [class*="Row"]:not(.sgtRow) {
    min-width: 0;
  }

  
  #app-root [class*="-card"],
  #app-root [class*="Card"],
  #app-root [class*="-panel"],
  #app-root [class*="Panel"] {
    min-width: 0;
  }

  #app-root .pk-main { padding-left: var(--mobGutter); padding-right: var(--mobGutter); }
  #app-root .pk-footer-grid { gap: 22px; }

  
  #app-root p, #app-root li, #app-root td, #app-root dd {
    overflow-wrap: anywhere;
  }
}



@media (max-width: 767px) {
  
  #app-root table {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }
  #app-root table thead th:first-child,
  #app-root table tbody td:first-child,
  #app-root table tbody th:first-child {
    position: sticky;
    left: 0;
    z-index: 2;
    background: var(--i-surface-1);
    
    box-shadow: 1px 0 0 0 var(--i-hair);
  }
  #app-root table thead th:first-child { z-index: 3; }

  
  #app-root .sgtHead > .sgtHeadCell:first-child,
  #app-root .sgtRow > .sgtCell:first-child {
    position: sticky;
    left: 0;
    z-index: 3;
    background: var(--i-surface-1);
    box-shadow: 1px 0 0 0 var(--i-hair);
  }

  
  #app-root table:has(td[data-label]) {
    display: block;
    overflow-x: visible;
    border-collapse: separate;
    border-spacing: 0;
  }
  #app-root table:has(td[data-label]) thead { display: none; }
  #app-root table:has(td[data-label]) tbody { display: block; }

  #app-root table:has(td[data-label]) tbody tr {
    display: block;
    margin-bottom: 10px;
    padding: 10px 12px;
    border: 1px solid var(--i-hair);
    border-radius: var(--i-r-card);
    background: var(--i-surface-1);
  }

  
  #app-root table:has(td[data-label]) tbody tr > :first-child {
    display: block;
    padding: 0 0 7px;
    margin-bottom: 7px;
    border: 0;
    border-bottom: 1px solid var(--i-hair);
    font-weight: 600;
    color: var(--i-ink-1);
  }
  #app-root table:has(td[data-label]) tbody tr > :first-child::before { content: none; }

  #app-root table:has(td[data-label]) tbody td {
    display: grid;
    grid-template-columns: minmax(0, 11ch) minmax(0, 1fr);
    align-items: baseline;
    gap: 10px;
    padding: 3px 0;
    border: 0;
    text-align: left !important;
  }
  #app-root table:has(td[data-label]) tbody td[data-label]::before {
    content: attr(data-label);
    color: var(--i-ink-3);
    font-size: var(--i-t-xs);
    letter-spacing: var(--i-track-label);
    text-transform: uppercase;
    overflow-wrap: anywhere;
  }

  
  #app-root .sgtRoot:has(.sgtCell[data-label]) .sgtHead { display: none; }

  #app-root .sgtRoot:has(.sgtCell[data-label]) .sgtRow {
    display: block;
    margin-bottom: 10px;
    padding: 10px 12px;
    border: 1px solid var(--i-hair);
    border-radius: var(--i-r-card);
    background: var(--i-surface-1);
    height: auto !important;      
  }

  #app-root .sgtRoot:has(.sgtCell[data-label]) .sgtRow > .sgtCell:first-child {
    display: block;
    padding: 0 0 7px;
    margin-bottom: 7px;
    border-bottom: 1px solid var(--i-hair);
    font-weight: 600;
    color: var(--i-ink-1);
    position: static !important;  
    left: auto !important;
  }
  #app-root .sgtRoot:has(.sgtCell[data-label]) .sgtRow > .sgtCell:first-child::before {
    content: none;
  }

  #app-root .sgtRoot:has(.sgtCell[data-label]) .sgtCell {
    display: grid;
    grid-template-columns: minmax(0, 11ch) minmax(0, 1fr);
    align-items: baseline;
    gap: 10px;
    padding: 3px 0;
    text-align: left !important;
  }
  #app-root .sgtRoot:has(.sgtCell[data-label]) .sgtCell[data-label]::before {
    content: attr(data-label);
    color: var(--i-ink-3);
    font-size: var(--i-t-xs);
    letter-spacing: var(--i-track-label);
    text-transform: uppercase;
    overflow-wrap: anywhere;
  }
  
  #app-root .sgtRoot:has(.sgtCell[data-label]) .sgtFill { display: none; }
}



@media (max-width: 767px) {
  
  html[data-mobpull-page],
  html[data-mobpull-page] body { overscroll-behavior-y: contain; }

  [data-mobpull] {
    position: relative;
    overscroll-behavior-y: contain;
  }

  .mobPullCue {
    position: absolute;
    top: 0;
    left: 50%;
    z-index: 5;
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    margin-left: -15px;
    border-radius: var(--i-r-pill);
    background:
      conic-gradient(var(--i-orchid) calc(var(--mobPullT, 0) * 360deg), var(--i-hair) 0);
    opacity: calc(0.25 + var(--mobPullT, 0) * 0.75);
    transform: translateY(calc(var(--mobPullPx, 0px) - 34px));
    pointer-events: none;
  }

  
  .mobPullCue::after {
    content: "";
    width: 22px;
    height: 22px;
    border-radius: var(--i-r-pill);
    background: var(--i-surface-2);
  }

  [data-mobpull="armed"] .mobPullCue {
    opacity: 1;
    background: conic-gradient(var(--i-orchid-bright) 360deg, var(--i-orchid-bright) 0);
  }

  [data-mobpull="busy"] .mobPullCue {
    opacity: 1;
    transform: translateY(6px);
    animation: mobPullSpin 900ms linear infinite;
  }

  .mobPullLabel {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 5;
    transform: translateY(calc(var(--mobPullPx, 0px) + 2px));
    text-align: center;
    font-size: var(--i-t-xs);
    letter-spacing: var(--i-track-label);
    text-transform: uppercase;
    color: var(--i-ink-3);
    pointer-events: none;
    opacity: var(--mobPullT, 0);
  }
  [data-mobpull="busy"] .mobPullLabel { opacity: 1; transform: translateY(38px); }
}

@keyframes mobPullSpin {
  to { transform: translateY(6px) rotate(360deg); }
}



@media (max-width: 767px) {
  #app-root [role="dialog"],
  #app-root dialog {
    position: fixed !important;
    inset: auto 0 0 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: 86vh;
    margin: 0 !important;
    padding-bottom: calc(16px + var(--mobSafeB)) !important;
    border-radius: var(--i-r-panel) var(--i-r-panel) 0 0 !important;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  
  #app-root [class*="oast"] {
    bottom: calc(var(--mobNavTotal) + 12px) !important;
    left: var(--mobGutter) !important;
    right: var(--mobGutter) !important;
    width: auto !important;
    max-width: none !important;
  }
}



@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  #app-root #singularity-sidebar { transition: none !important; }
  [data-mobpull="busy"] .mobPullCue { animation: none !important; }
}

@media (max-width: 767px) {
  :root[data-motion="reduced"] #app-root #singularity-sidebar { transition: none !important; }
  :root[data-motion="reduced"] [data-mobpull="busy"] .mobPullCue { animation: none !important; }
}



@media (max-width: 767px) {
  :root { --mobChromeBg: rgba(8, 8, 10, 0.92); }
}

@media (max-width: 767px) and (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) { --mobChromeBg: rgba(250, 249, 252, 0.94); }
}

@media (max-width: 767px) {
  :root[data-theme="light"] { --mobChromeBg: rgba(250, 249, 252, 0.94); }
  :root[data-theme="dark"]  { --mobChromeBg: rgba(8, 8, 10, 0.92); }
}



@media print {
  #app-root.pk-page .pk-nav,
  #app-root #singularity-sidebar,
  .mobPullCue,
  .mobPullLabel { display: none !important; }
  #app-root.pk-page { padding-bottom: 0 !important; }
}



@media (max-width: 767px) {

  
  #app-root input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  #app-root select,
  #app-root textarea,
  #page-root input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  #page-root select,
  #page-root textarea { font-size: 16px !important; }

  
  #app-root.pk-page nav.pk-nav a.pk-nav-link { min-height: 44px !important; }

  
  #page-root button.pk-seg-toggle,
  #page-root button:not(.pk-nav-burger),
  #page-root a.pk-cta-button,
  #app-root.pk-page button:not(.pk-nav-burger),
  #app-root.pk-page a.pk-cta-button { min-height: 40px; }
}
