/* The second device composition reads the existing synthetic investigation. */
#journey.journey-device-demo { --dt-orange: #ff7a1a; }
#journey [hidden] { display: none !important; }
#journey .dt-phone-grid > [data-journey-phone] { min-height: 0; min-width: 0; height: 100%; }
#journey [data-journey-map] { min-height: 44px; padding: 5px 9px; border: 1px solid #7d9b80; border-radius: 6px; background: #224c3a; color: #fffefb; font: 600 .73rem var(--f-body, sans-serif); cursor: pointer; }
#journey .dt-tablet-appbar { padding-block: 5px; }
#journey .dt-tablet-display { color-scheme: light; --ink: #183d31; --muted: #536b59; --faint: #607861; --line: #d5dfd0; --line-2: #c5d3bf; --panel-solid: #fffefb; --panel-2: #eff4e9; --data: #21617c; --ok: #1b6a42; --warn: #8b530c; --crit: #a83135; --paper: #fffefb; --paper-ink: #183d31; --paper-muted: #536b59; --paper-line: #d5dfd0; color: var(--ink); }
#journey .journey-device-steps { flex: none; background: #fffefb; border-bottom: 1px solid #c5d3bf; }
#journey .journey-device-steps .stepper { overflow: hidden; border: 0; background: transparent; }
#journey .journey-device-steps button { min-width: 0; min-height: 59px; padding: 8px 4px; align-items: center; text-align: center; color: #536b59; }
#journey .journey-device-steps .t { display: none; }
#journey .journey-device-steps .ts { display: block; font-size: .76rem; }
#journey .journey-device-steps .n { color: #536b59; font-size: .65rem; }
#journey .journey-device-steps [aria-current="step"] { background: #fff0df; }
#journey .journey-device-steps [aria-current="step"] .ts { color: #183d31; font-weight: 700; }
#journey .dt-shared-work { padding: 12px; }
#journey .dt-tablet-screen #hsearch { max-width: 100%; margin: 0; }
#journey .dt-tablet-screen .hs-box { background: #fffefb; border-color: #9db59c; }
#journey .dt-tablet-screen .hs-box input { min-width: 0; color: #183d31; font-size: .84rem; }
#journey .dt-tablet-screen .hs-box input::placeholder { color: #617961; }
#journey .dt-tablet-screen .hs-box .btn { min-height: 44px; padding: 8px 12px; }
#journey .dt-tablet-screen .hs-row { flex-wrap: wrap; gap: 6px 12px; }
#journey .dt-tablet-screen .hs-loc { min-height: 44px; background: #fffefb; color: #235b78; border-color: #afc2a8; }
#journey .dt-tablet-screen .hs-msg { color: #536b59; font-size: .7rem; }
#journey .dt-tablet-screen .hs-list { background: #fffefb; color: #183d31; border-color: #afc2a8; }
#journey .dt-tablet-screen .console { min-width: 0; overflow: hidden; border: 1px solid #c5d3bf; border-radius: 9px; background: #fffefb; box-shadow: none; }
#journey .dt-tablet-screen .demo-grid { grid-template-columns: minmax(0, 1fr); min-height: 0; }
#journey .dt-tablet-screen .map { border: 0; border-bottom: 1px solid #c5d3bf; background: #193d31; --muted: #c2d8c7; --ink: #f0f7ed; }
#journey .dt-tablet-screen .map-tools { gap: 6px; padding: 11px 12px; border-color: #58715c; }
#journey .dt-tablet-screen .legend { gap: 5px 9px; font-size: .66rem; }
#journey .dt-tablet-screen #parcel-map { min-height: 0; width: 100%; height: auto; }
#journey .dt-tablet-screen #parcel-map .parcel { stroke: #ead05a; }
#journey .dt-tablet-screen .map .note { color: #c2d8c7; font-size: .74rem; }
#journey .dt-tablet-screen .insp { overflow: visible; max-height: none; padding: 16px; gap: 13px; }
#journey .dt-tablet-screen .insp p, #journey .dt-tablet-screen .req .kv dd { color: #365a43; }
#journey .dt-tablet-screen .insp h3 { color: #183d31; font-size: 1.1rem; }
#journey .dt-tablet-screen .btn, #journey .dt-tablet-screen .req-h, #journey .dt-tablet-screen .cand, #journey .dt-tablet-screen .seg button { min-height: 44px; }
#journey .dt-tablet-screen .req-h { grid-template-columns: minmax(0, 1fr); gap: 6px; padding-bottom: 9px; }
#journey .dt-tablet-screen .req-h .pill { justify-self: start; }
#journey .dt-tablet-screen .rule { background: #f0f5eb; color: #365a43; }
#journey .dt-tablet-screen .j-concl { grid-template-columns: minmax(0, 1fr); gap: 8px; padding: 15px; background: #f0f5eb; }
#journey .dt-tablet-screen .j-concl .verdict-pill { justify-self: start; white-space: normal; font-size: .95rem; }
#journey .dt-tablet-screen .j-concl .q { font-size: .85rem; }
#journey .dt-tablet-screen .j-nav { flex-wrap: wrap; gap: 8px; }
#journey .dt-tablet-screen .doc { padding: 16px 13px; box-shadow: none; border: 1px solid #d5dfd0; }
#journey .dt-tablet-screen .ladder { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#journey .dt-tablet-screen :is(button, input, [tabindex]):focus-visible { outline: 3px solid #2563eb; outline-offset: -3px; }
@media (hover: hover) {
  #journey [data-journey-map]:hover { border-color: #ff7a1a; color: #ffbb83; }
  #journey .journey-device-steps button:hover, #journey .dt-tablet-screen :is(.usegrid button, .req-h, .cand, .seg button):hover { background: #fff0df; box-shadow: inset 0 -2px 0 #ff7a1a; }
}
@media (max-width: 480px) {
  #journey .journey-device-steps button { min-height: 55px; }
  #journey .journey-device-steps .ts { font-size: .67rem; }
  #journey .dt-shared-work { padding: 6px; }
  #journey .dt-tablet-appbar { flex-wrap: wrap; gap: 2px 10px; }
  #journey .dt-tablet-appbar > span:last-child { font-size: .65rem; }
  #journey .dt-tablet-screen .hs-box { padding-left: 8px; gap: 5px; }
  #journey .dt-tablet-screen .hs-box > svg { display: none; }
  #journey .dt-tablet-screen .hs-box .btn { padding-inline: 9px; font-size: .78rem; }
  #journey .dt-tablet-screen .usegrid { grid-template-columns: minmax(0, 1fr); }
  #journey .dt-tablet-screen .kv { grid-template-columns: minmax(0, 1fr); gap: 3px; }
  #journey .dt-tablet-screen .kv dd { margin-bottom: 7px; }
}