@charset "UTF-8";

dialog.or-dialog {
  position: fixed;
  inset: 0;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  height: 100dvh;
  max-width: none;
  max-height: none;
  border: 0;
  border-radius: 0;
  background: var(--paper);
  color: var(--ink);
  box-shadow: none;
  overflow: hidden;
}
.or-dialog[open] { display: block; }
.or-dialog [hidden] { display: none !important; }
.or-frame {
  height: 100%;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.or-inner { width: min(100% - clamp(40px, 9vw, 152px), 1320px); margin-inline: auto; }
.or-top { border-top: 4px solid var(--red); }
.or-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding-block: clamp(18px, 3.2vh, 36px) 14px;
}
.or-heading h2 {
  font: 640 clamp(29px, 3.4vw, 46px)/1.08 var(--heading);
  margin: 0;
  letter-spacing: -.055em;
}
.or-heading h2:focus { outline: 0; }
.or-message {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2px 12px;
  font-size: 14px;
  color: var(--muted);
  line-height: 1.4;
  margin-top: 8px;
}
.or-status { color: #365846; font-weight: 650; }
.or-status:not(:empty)::before { content: "·"; color: var(--muted); margin-right: 8px; }
.or-status-issue { color: var(--red); }
.or-close {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  border: 1px solid #c2c8c1;
  border-radius: 22px;
  min-height: 36px;
  padding: 5px 13px 5px 10px;
  font-size: 14px;
  font-weight: 600;
}
.or-close:hover, .or-clear:hover { background: #ebece5; }
.or-close svg, .or-search svg { width: 17px; height: 17px; }
.or-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding-block: 8px 16px;
}
.or-dialog .or-search,
.or-dialog .or-select { position: relative; display: flex; margin: 0; align-items: center; }
.or-search { min-width: 120px; width: min(270px, 35%); }
.or-search svg { position: absolute; left: 11px; color: var(--muted); pointer-events: none; }
.or-dialog .or-search input, .or-dialog .or-select select {
  border: 1px solid #c6cbc3;
  margin: 0;
  height: 36px;
  min-width: 0;
  color: var(--ink);
  font: 500 14px/1.1 Karla, sans-serif;
  background-color: white;
  border-radius: 4px;
}
.or-dialog .or-search input { padding-inline: 34px 10px; }
.or-dialog .or-select select { padding: 0 26px 0 11px; }
.or-reset-all, .or-confirm-no {
  color: var(--muted);
  font: 500 13px/1.2 Karla, sans-serif;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.or-reset-all { margin-left: auto; min-height: 36px; }
.or-reset-all:disabled { opacity: .48; cursor: default; text-decoration: none; }
.or-confirm {
  flex: 1 1 100%;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  align-items: center;
  color: var(--ink);
  font-size: 14px;
}
.or-confirm-yes { border-radius: 3px; padding: 6px 11px; background: var(--red); color: #fff; }
.or-chart {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  border-top: 1px solid #a7afa5;
  padding-bottom: 26px;
}
.or-grid {
  display: grid;
  grid-template-columns: minmax(148px, 27%) minmax(80px, 1fr) minmax(110px, 13%);
  column-gap: clamp(12px, 2vw, 32px);
  align-items: center;
}
.or-label-wrap {
  position: sticky;
  z-index: 2;
  top: 0;
  background: var(--paper);
  border-bottom: 1px solid var(--line);
}
.or-labels {
  color: var(--muted);
  font: 610 12px/1 Karla, sans-serif;
  letter-spacing: .015em;
  height: 35px;
  font-variant-numeric: tabular-nums;
}
.or-axis { height: 20px; position: relative; }
.or-axis span { position: absolute; top: 4px; translate: -50% 0; white-space: nowrap; }
.or-axis .or-tick-start { translate: 0; }
.or-axis .or-tick-end { translate: -100% 0; }
.or-price-head { text-align: right; padding-right: 26px; }
.or-list { padding: 0; margin-block: 0; list-style: none; }
.or-row {
  min-height: 57px;
  padding: 6px 0;
  border-bottom: 1px solid #e0e3dc;
  scroll-margin-block: 45px 15px;
}
.or-row:hover, .or-row:focus-within { background: #f1f3ee; }
.or-outlet { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-width: 0; }
.or-name { font-weight: 650; font-size: 15px; line-height: 1.2; overflow-wrap: anywhere; }
.or-category { display: flex; align-items: center; gap: 6px; font-size: 12px; line-height: 1.3; color: var(--muted); }
.or-dot { width: 6px; height: 6px; display: inline-block; background: var(--or-color); border-radius: 50%; }
.or-dialog .or-plot {
  height: 34px;
  display: flex;
  align-items: center;
  margin: 0;
  cursor: text;
  border-left: 1px solid #c4cbc1;
  background-image: repeating-linear-gradient(to right, transparent 0, transparent calc(var(--or-grid-step) - 1px), #e2e5de calc(var(--or-grid-step) - 1px), #e2e5de var(--or-grid-step));
}
.or-bar {
  display: block;
  height: 13px;
  background: var(--or-color);
  border-radius: 0 2px 2px 0;
}
.or-value { position: relative; display: flex; justify-content: flex-end; align-items: center; padding-right: 25px; }
.or-number { display: flex; align-items: flex-end; flex-direction: column; min-width: 0; }
.or-dialog input.or-input {
  max-width: 100%;
  width: 9.2ch;
  min-width: 0;
  margin: 0;
  padding: 2px 4px;
  line-height: 20px;
  border: 1px solid transparent;
  border-radius: 3px;
  font-size: 16px;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  background: transparent;
  text-align: right;
}
.or-dialog .or-row:hover input.or-input, .or-dialog .or-input:focus,
.or-dialog .or-custom input.or-input { border-color: #b8c1b7; background: white; }
.or-dialog input.or-input:focus { outline: 2px solid var(--or-color); outline-offset: 1px; }
.or-unit { white-space: nowrap; font-size: 11px; line-height: 1.2; color: var(--muted); padding-right: 5px; }
.or-undo { position: absolute; right: 0; width: 24px; height: 28px; display: grid; place-items: center; padding: 4px; color: var(--muted); }
.or-undo svg { width: 15px; height: 15px; }
.or-undo:hover { color: var(--ink); }
.or-empty { padding-block: 30px; }
.or-empty p { margin: 0 0 9px; }
.or-clear { padding: 6px 10px; border-radius: 4px; border: 1px solid var(--line); }
.or-sr {
  clip-path: inset(50%); width: 1px; height: 1px; position: absolute;
  overflow: hidden; white-space: nowrap;
}
@media (max-width: 640px) {
  .or-inner { width: calc(100% - 30px); }
  .or-head { padding-block: 15px 7px; }
  .or-message { font-size: 13px; margin-top: 6px; }
  .or-close { min-height: 32px; }
  .or-controls { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 6px; padding-block: 10px; }
  .or-search { width: 100%; grid-column: 1; }
  .or-controls .or-select:nth-child(2) { grid-column: 1; grid-row: 2; }
  .or-controls .or-select:nth-child(3) { grid-column: 2; grid-row: 2; }
  .or-reset-all { grid-column: 2; grid-row: 1; font-size: 12px; }
  .or-confirm { grid-column: 1 / -1; flex-wrap: wrap; justify-content: flex-start; gap: 5px; }
  .or-grid { grid-template-columns: minmax(0,1fr) 91px; column-gap: 10px; }
  .or-labels { height: 37px; grid-template-rows: 15px 16px; }
  .or-count { align-self: end; font-size: 11px; }
  .or-axis { grid-row: 2; grid-column: 1; font-size: 10px; height: 12px; }
  .or-axis span { top: 1px; }
  .or-price-head { grid-column: 2; grid-row: 1 / 3; padding-right: 15px; }
  .or-row { min-height: 74px; grid-template-rows: auto 14px; row-gap: 3px; }
  .or-name { font-size: 14px; }
  .or-category { font-size: 11px; }
  .or-dialog .or-plot { grid-column: 1; grid-row: 2; height: 14px; }
  .or-bar { height: 7px; }
  .or-value { grid-column: 2; grid-row: 1 / 3; padding-right: 14px; }
  .or-undo { right: -7px; }
}
@media (max-height:480px) and (orientation:landscape) {
  .or-head { padding-block: 7px 0; }
  .or-heading h2 { font-size: 25px; }
  .or-message { margin-top: 1px; }
  .or-controls { padding-block: 5px; }
}
.or-row .or-name {
  display: block;
  margin: 0;
  padding: 1px 0;
  font: 650 15px/1.2 Karla, sans-serif;
  color: var(--ink);
  text-align: left;
}
.or-info {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: .08em;
  font: 650 9px/1 Karla, sans-serif;
  border-radius: 50%;
  width: 13px;
  height: 13px;
  border: 1px solid #a8b0a5;
  color: #546052;
  margin-inline-start: 5px;
}
.or-name:hover .or-info, .or-name:focus-visible .or-info { color: var(--ink); border-color: var(--ink); }
.or-tip {
  position: fixed;
  z-index: 7;
  width: max-content;
  max-width: min(300px, calc(100vw - 16px));
  padding: 12px 15px;
  border-radius: 5px;
  background: #24312c;
  color: #fff;
  box-shadow: 0 5px 20px #10271f33;
  pointer-events: none;
  text-align: left;
  font: 400 14px/1.35 Karla, sans-serif;
}
.or-tip .or-tip-medium { margin: 0 0 2px; color: #cbd6cb; font-size: 12px; }
.or-tip-title { display: block; font-size: 17px; line-height: 1.2; }
.or-tip-price { margin: 7px 0 2px; font-size: 15px; font-weight: 650; font-variant-numeric: tabular-nums; }
.or-tip-basis { color: #d7ded5; font-size: 12px; }
.or-tip-formats {
  display: grid;
  grid-template-columns: minmax(75px,1fr) max-content;
  gap: 3px 12px;
  padding-top: 7px;
  margin: 8px 0 0;
  border-top: 1px solid #63746a;
  font-size: 12px;
}
.or-tip-formats dt, .or-tip-formats dd { margin: 0; }
.or-tip-formats dd { text-align: right; font-variant-numeric: tabular-nums; }
@media (max-width: 640px) {
  .or-row .or-name { font-size: 14px; padding-block: 2px; }
}

.or-dialog .or-footer {
  flex: 0 0 auto;
  display: block;
  margin: 0;
  padding: 8px 0 max(8px, env(safe-area-inset-bottom));
  border-top: 1px solid var(--line);
  color: var(--muted);
  font: 400 12px/1.35 Karla, sans-serif;
}
.or-footer p { margin-block: 0; }