/* ORZENO terminal engine — styles for the shell layer. */
body[data-mode='pro'] .tag--sim,
body[data-mode='pro'] [hidden] {
  display: none !important;
}
.tag--acct {
  border-color: color-mix(in srgb, var(--d-accent) 55%, transparent);
  color: var(--d-accent);
}
.pr-acct {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid color-mix(in srgb, var(--d-accent) 45%, transparent);
  border-radius: var(--d-radius-sm);
  font-family: var(--d-font-mono);
  font-size: 0.66rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--d-accent);
  transition: background-color 0.2s var(--d-ease);
}
.pr-acct:hover {
  background: color-mix(in srgb, var(--d-accent) 10%, transparent);
}
.pr-acct .dot,
.pr-chip .dot {
  margin-right: 0;
}
.pr-acct b {
  font-weight: 500;
  color: var(--d-text);
}
.pr-chip {
  gap: 8px;
}
.pr-chip small {
  padding-left: 8px;
  border-left: 1px solid var(--d-line);
  font-size: 0.86em;
  color: var(--d-muted);
}
.pr-chip .num {
  text-transform: none;
  letter-spacing: 0.04em;
}
.pr-tape {
  overflow: hidden;
  border-bottom: 1px solid var(--d-line-2);
  background: var(--d-inset);
  mask-image: linear-gradient(90deg, transparent, #000 48px, #000 calc(100% - 48px), transparent);
}
.pr-tape-in {
  display: flex;
  width: max-content;
  animation: pr-tape 90s linear infinite;
}
.pr-tape:hover .pr-tape-in {
  animation-play-state: paused;
}
@keyframes pr-tape {
  to {
    transform: translateX(-50%);
  }
}
.pr-tick {
  display: inline-flex;
  align-items: baseline;
  gap: 10px;
  padding: 7px 22px;
  border-right: 1px solid var(--d-line-2);
  font-family: var(--d-font-mono);
  font-size: 0.7rem;
  white-space: nowrap;
}
.pr-tick b {
  font-weight: 500;
  letter-spacing: 0.1em;
  color: var(--d-muted);
}
.pr-tick.is-up .pr-px {
  animation: pr-up 0.9s var(--d-ease);
}
.pr-tick.is-dn .pr-px {
  animation: pr-dn 0.9s var(--d-ease);
}
@keyframes pr-up {
  from {
    color: var(--d-up);
  }
}
@keyframes pr-dn {
  from {
    color: var(--d-down);
  }
}
.pr-feed {
  width: 36px;
  padding: 0;
}
.pr-lead {
  color: var(--d-muted);
  margin-bottom: 14px;
}
.pr-opts {
  display: grid;
  gap: 8px;
}
.pr-opts button {
  display: grid;
  grid-template-columns: 40px 1fr auto;
  align-items: center;
  gap: 12px;
  min-height: 62px;
  padding: 10px 14px;
  border: 1px solid var(--d-line);
  border-radius: var(--d-radius-sm);
  background: var(--d-inset);
  text-align: left;
  transition:
    border-color 0.2s var(--d-ease),
    background-color 0.2s var(--d-ease),
    transform 0.2s var(--d-ease);
}
.pr-opts button:hover {
  border-color: var(--d-accent);
  background: color-mix(in srgb, var(--d-accent) 8%, transparent);
}
.pr-opts button > .i:last-child {
  color: var(--d-muted);
  transition: transform 0.2s var(--d-ease);
}
.pr-opts button:hover > .i:last-child {
  color: var(--d-accent);
  transform: translateX(3px);
}
.pr-opts b {
  display: block;
  font-weight: 600;
}
.pr-opts small {
  display: block;
  font-size: 0.82rem;
  color: var(--d-muted);
}
.pr-ico {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid var(--d-line);
  border-radius: 50%;
  color: var(--d-accent);
}
.pr-ico .i {
  width: 20px;
  height: 20px;
}
.pr-steps {
  display: grid;
  gap: 4px;
}
.pr-steps li {
  display: grid;
  grid-template-columns: 22px 1fr;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  color: var(--d-muted);
  transition: color 0.3s var(--d-ease);
}
.pr-steps i {
  width: 18px;
  height: 18px;
  border: 1.5px solid var(--d-line);
  border-radius: 50%;
}
.pr-steps .is-now {
  color: var(--d-text);
}
.pr-steps .is-now i {
  border-color: color-mix(in srgb, var(--d-accent) 30%, transparent);
  border-top-color: var(--d-accent);
  animation: pr-spin 0.8s linear infinite;
}
.pr-steps .is-done {
  color: var(--d-text);
}
.pr-steps .is-done i {
  border-color: var(--d-up);
  background: radial-gradient(circle, var(--d-up) 0 42%, transparent 46%);
}
@keyframes pr-spin {
  to {
    transform: rotate(360deg);
  }
}
.pr-perm {
  display: grid;
  gap: 14px;
}
.pr-checks {
  display: grid;
  gap: 2px;
}
.pr-checks li {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 12px;
  align-items: start;
  padding: 9px 0;
  border-bottom: 1px solid var(--d-line-2);
  color: var(--d-muted);
}
.pr-checks li > .i {
  margin-top: 2px;
  color: var(--d-down);
}
.pr-checks .is-on {
  color: var(--d-text);
}
.pr-checks .is-on > .i {
  color: var(--d-up);
}
.pr-checks b {
  display: block;
  font-weight: 600;
}
.pr-checks small {
  display: block;
  font-size: 0.82rem;
  color: var(--d-muted);
}
@media (max-width: 640px) {
  body[data-mode='pro'] .sim-clock {
    display: none;
  }
  body[data-mode='pro'] .top {
    gap: 8px;
    padding: 8px 12px;
  }
  body[data-mode='pro'] .top .pr-feed {
    flex: none;
  }
  .pr-acct {
    margin-left: auto;
  }
}
@media (max-width: 1240px) {
  body[data-mode='pro'] .top-product {
    display: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .pr-tape {
    overflow-x: auto;
    scrollbar-width: none;
  }
  .pr-steps .is-now i {
    animation: none !important;
    border-color: var(--d-accent);
  }
}