.smart-suggestion{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:13px;
  align-items:center;
  margin-bottom:16px;
  background:linear-gradient(135deg,#f5f8ff,#ffffff);
  border-color:#c9dafa;
}

.smart-icon{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:#e3edff;
  color:var(--blue);
  font-size:1.25rem;
  font-weight:850;
}

.smart-heading{
  display:flex;
  align-items:center;
  gap:9px;
  flex-wrap:wrap;
}

.smart-heading h3{margin:0;font-size:1rem}
.smart-heading span{color:var(--blue);font-size:.72rem;font-weight:800}
.smart-copy p{margin:3px 0;color:var(--muted);font-size:.78rem}
.smart-copy small{color:#516a84;font-size:.73rem}

.native-mapping{margin-bottom:16px}
.native-signal-shape{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:14px 0 3px}
.native-signal-shape span{display:grid;gap:4px;padding:10px;background:#f5f8ff;border:1px solid #d6e2f3;border-radius:8px}
.native-signal-shape b{font:12px ui-monospace,SFMono-Regular,Menlo,monospace;color:#2455a8}
.native-signal-shape small{color:var(--muted);line-height:1.35}
.native-mapping label{display:block;color:#42556b;font-size:.78rem;font-weight:750;margin:14px 0}
.native-mapping input{display:block;width:100%;margin-top:7px;border:1px solid #cdd9e6;background:#fbfdff;border-radius:8px;padding:.72rem;color:var(--ink)}

.field-group{
  grid-column:1 / -1;
  border:1px solid #d6e2f3;
  border-radius:8px;
  background:#f8fbff;
  overflow:hidden;
}

.field-group summary{
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:.65rem .75rem;
  color:#2455a8;
  cursor:pointer;
  font-size:.76rem;
  font-weight:750;
  list-style:none;
}

.field-group summary::-webkit-details-marker{display:none}
.field-group summary::before{content:"▸";margin-right:7px;color:#7990ad}
.field-group[open] summary::before{content:"▾"}
.field-group summary span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.field-group summary small{color:var(--muted);font-weight:600;white-space:nowrap}
.field-group-fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(175px,1fr));gap:7px;padding:0 8px 8px}

.field-detail-row{
  display:grid;
  grid-template-columns:90px 1fr;
  gap:12px;
  align-items:start;
  padding:9px 0;
  border-bottom:1px solid var(--line);
  font-size:.8rem;
}

.field-detail-row>span{color:var(--muted);font-weight:750}
.field-detail-row code{word-break:break-all;color:#2455a8}
.field-detail-modal label{display:block;margin-top:16px;color:#42556b;font-size:.78rem;font-weight:750}
.field-detail-value{
  max-height:260px;
  overflow:auto;
  white-space:pre-wrap;
  word-break:break-word;
  background:#f8fbff;
  border:1px solid var(--line);
  border-radius:8px;
  padding:12px;
  margin:7px 0 0;
  font:12px ui-monospace,SFMono-Regular,Menlo,monospace;
  color:var(--ink);
}

.checkline{
  display:flex!important;
  align-items:center;
  gap:8px;
  color:#52657a!important;
  font-weight:650!important;
}

.checkline input{width:auto!important;margin:0!important}

/* Keep the Shape controls consistent with the block UI. The base stylesheet
 * intentionally has form styling for modals/settings, but these controls live
 * inside the mapping cards as well. */
.mapping-card label > input:not([type="checkbox"]),
.mapping-card label > select,
.mapping-card .field-select{
  display:block;
  width:100%;
  margin-top:7px;
  padding:.68rem .75rem;
  border:1px solid #cdd9e6;
  border-radius:8px;
  background:#fbfdff;
  color:var(--ink);
  line-height:1.25;
  min-height:42px;
}

.mapping-card label > input:not([type="checkbox"]):focus,
.mapping-card label > select:focus,
.mapping-card .field-select:focus{
  border-color:var(--blue);
  outline:3px solid #2563eb18;
}

.signal-section{
  border-top:1px solid #e6edf5;
  padding-top:10px;
  margin-top:10px;
}

.signal-section:first-of-type{border-top:0;padding-top:0;margin-top:0}
.signal-section h4{margin:0;color:#263d55;font-size:.84rem;letter-spacing:-.01em}
.signal-section label{margin:7px 0 0}
.mapping-card .signal-section label > input:not([type="checkbox"]),
.mapping-card .signal-section label > select,
.mapping-card .signal-section .field-select{min-height:38px;padding:.55rem .68rem}
.mapping-card .signal-section .checkline{margin-top:7px}
.signal-section [hidden]{display:none!important}
.mapping-card > .shape-help{margin-bottom:8px}

/* Useful details can be reordered without changing the field-mapping controls. */
.mapping-card #detail-list .detail-row{
  grid-template-columns:18px minmax(0,1fr) 20px minmax(0,1.6fr) 25px;
  cursor:grab;
}
.mapping-card #detail-list .detail-row:active{cursor:grabbing}
.detail-grip{color:#7990ad;font-size:.8rem;letter-spacing:-.25em;line-height:1;text-align:center;user-select:none}
.detail-row.dragging{opacity:.5}
.detail-row.reorder-target{outline:2px solid var(--blue);outline-offset:2px}

.event-time-help{
  margin:8px 0 0;
  padding:10px 12px;
  border:1px solid #d6e2f3;
  border-radius:8px;
  background:#f8fbff;
  font-size:.73rem;
}

.event-time-help code{color:#2455a8;font-size:.72rem}

.preview-showcase{margin-top:18px;background:#172d49;border-radius:14px;padding:18px;color:#dce9f6}
.preview-showcase-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:14px}
.preview-showcase-head h3{margin:0 0 4px;font-size:1rem;color:#fff}
.preview-showcase-head p{margin:0;color:#a9bfd5;font-size:.76rem;line-height:1.45}
.preview-note{border:1px solid #41617f;border-radius:999px;padding:.35rem .55rem;color:#9bdde0;font-size:.68rem;white-space:nowrap}
.vision-preview-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:10px}
.vision-preview-stack{display:grid;gap:10px}
.signal-list-preview{position:relative;min-height:150px;background:#202b38;border-color:#4a5c70}
.signal-list-preview .vision-view-label{padding-right:75px}
.preview-expand-toggle{position:absolute;top:9px;right:10px;background:transparent;color:#a9bfd5;border:1px solid #41617f;border-radius:6px;padding:.25rem .45rem;font-size:.62rem;font-weight:750}
.preview-expand-toggle:hover{background:#294967;color:#fff}
.signal-list-preview .mock-signal-row{padding:10px 11px;border:1px solid #4a5c70;border-radius:7px;background:#202b38;box-shadow:0 5px 12px #07111f35}
.signal-list-preview .mock-signal-row strong{color:#fff}
.signal-list-preview .mock-signal-row time{color:#d1dbe5}
.signal-list-preview .mock-signal-row small{display:block;color:#9db4c9;font-size:.65rem;margin-left:22px;flex-basis:100%}
.mock-signal-expanded{margin-top:0;padding:12px;background:#202b38;border:1px solid #4a5c70;border-radius:9px;box-shadow:0 12px 24px #07111f40}
.mock-signal-expanded h4{margin:0 0 10px;color:#fff;font-size:.76rem}
.mock-signal-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px 28px;margin-bottom:16px}
.mock-signal-detail-grid>div{min-width:0;display:grid;gap:3px}
.mock-signal-detail-grid span{color:#9db4c9;font-size:.62rem}
.mock-signal-detail-grid b{color:#f0f5fa;font-size:.69rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mock-camera-preview{display:grid;grid-template-columns:minmax(180px,330px);gap:8px}
.mock-camera-placeholder{display:grid;gap:5px;padding:0;border:0;border-radius:0;background:transparent;color:#dce9f6}
.mock-snapshot-frame{position:relative;aspect-ratio:16 / 9;display:grid;place-items:center;overflow:hidden;border:1px solid #58758e;border-radius:6px;background:linear-gradient(180deg,#667f8d 0%,#3b596d 51%,#263d4d 52%,#172532 100%)}
.mock-snapshot-frame::before{content:"";position:absolute;inset:52% 0 0;background:repeating-linear-gradient(74deg,transparent 0 38px,#8ba2ae26 39px 40px),linear-gradient(165deg,transparent 0 48%,#0d1822aa 49% 100%)}
.mock-snapshot-frame::after{content:"";position:absolute;inset:7px;border:1px solid #dce9f633;border-radius:4px;pointer-events:none}
.mock-snapshot-label,.mock-snapshot-status{position:absolute;z-index:1;color:#f0f5fa;font-size:.55rem;letter-spacing:.08em;font-weight:850;text-transform:uppercase}
.mock-snapshot-label{top:8px;left:9px;padding:.22rem .35rem;border-radius:4px;background:#07111fcc}
.mock-snapshot-status{bottom:8px;left:9px;color:#b9d3e4;font-size:.52rem}
.mock-snapshot-crosshair{position:relative;z-index:1;color:#dce9f6aa;font-size:1.4rem;font-weight:300}
.mock-camera-placeholder>b{font-size:.7rem}
.mock-camera-placeholder>small{color:#a9bfd5;font-size:.62rem}
.mock-camera-placeholder b{font-size:.7rem}
.mock-camera-placeholder small{color:#a9bfd5;font-size:.62rem}
.signal-list-preview.collapsed .mock-signal-row{border-bottom:0}
.signal-list-preview.collapsed .mock-signal-expanded{display:none}
.signal-list-preview.collapsed{min-height:0}
.vision-view{background:#1e3854;border:1px solid #365674;border-radius:10px;padding:11px;min-width:0}
.vision-view-label{font-size:.62rem;letter-spacing:.1em;color:#7bd9e0;font-weight:850;margin-bottom:10px}
.mock-signal-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:.72rem}
.mock-signal-row strong{color:#fff}
.mock-signal-row time{color:#aec4d8;margin-left:auto;font-size:.64rem}
.mock-chevron{color:#7bd9e0}
.vision-view>small{display:block;color:#9db4c9;margin:8px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mock-tag{display:inline-block;background:#0aa0a8;color:#fff;border-radius:999px;padding:.18rem .42rem;font-size:.61rem;font-weight:800}
.mock-hover-card,.mock-detail-card{background:#202b38;border:1px solid #4a5c70;border-radius:9px;padding:12px;box-shadow:0 12px 24px #07111f40}
.mock-hover-timeline{position:relative;min-height:185px;padding:7px 4px 40px;display:flex;justify-content:center;align-items:flex-start}
.mock-timeline-line{position:absolute;left:6px;right:6px;bottom:22px;height:2px;background:#536779}
.mock-timeline-dot{position:absolute;bottom:17px;width:9px;height:9px;border-radius:50%;background:#3d586c;border:2px solid #1e3854;z-index:1}
.mock-timeline-dot.muted{left:24%;opacity:.7}
.mock-timeline-dot.muted.second{left:76%}
.mock-timeline-dot.selected{left:50%;bottom:15px;width:13px;height:13px;background:#0aa0a8;border-color:#8ce4e4;box-shadow:0 0 0 4px #0aa0a833}
.mock-timeline-time{position:absolute;right:4px;bottom:3px;color:#9db4c9;font-size:.6rem}
.mock-hover-timeline .mock-hover-card{position:absolute;left:50%;bottom:34px;z-index:2;width:min(260px,calc(100% - 24px));transform:translateX(-50%);margin:0}
.mock-hover-timeline .mock-hover-card::after{content:"";position:absolute;left:50%;bottom:-7px;transform:translateX(-50%);border-left:7px solid transparent;border-right:7px solid transparent;border-top:7px solid #4a5c70}
.mock-hover-card{max-width:230px;margin:0 auto}
.mock-hover-head{display:flex;align-items:center;gap:8px;margin-bottom:10px;min-width:0}
.mock-hover-head small{margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mock-hover-details{display:grid;gap:6px}
.mock-hover-detail{display:grid;grid-template-columns:78px minmax(0,1fr);gap:8px;font-size:.66rem}
.mock-hover-detail span{color:#d1dbe5;font-weight:750;text-transform:lowercase}
.mock-hover-detail b{color:#f0f5fa;min-width:0;overflow-wrap:anywhere;word-break:break-word;font-weight:500}
.mock-hover-empty{color:#9db4c9;font-size:.68rem}
.mock-hover-card>b,.mock-detail-card h4{display:block;color:#fff;margin:0 0 5px;font-size:.83rem}
.mock-hover-card small{display:block;color:#9db4c9;font-size:.65rem;margin-bottom:8px}
.mock-hover-card p,.mock-detail-card p{color:#d1dbe5;font-size:.7rem;line-height:1.4;margin:9px 0}
.mock-hover-card em{font-style:normal;color:#9db4c9;font-size:.63rem}
.mock-detail-card hr{border:0;border-top:1px solid #405267;margin:11px 0}
.vision-detail-row{display:grid;grid-template-columns:88px 1fr;gap:8px;margin:7px 0;font-size:.68rem}
.vision-detail-row span{color:#a9baca;text-transform:capitalize}
.vision-detail-row b{color:#f0f5fa;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vision-empty{color:#9db4c9;font-size:.7rem;padding:8px 0}

/* Send step */
.https-destination-card{margin-top:16px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px;box-shadow:0 2px 12px #2c477b08}
.https-destination-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;padding-bottom:15px;border-bottom:1px solid var(--line)}
.https-destination-heading h3{margin:0 0 4px;font-size:1rem}.https-destination-heading p{margin:0;color:var(--muted);font-size:.76rem;line-height:1.45}
.secure-badge{white-space:nowrap;border:1px solid #b8e0cb;border-radius:999px;background:#f0fbf5;color:#157347;padding:.38rem .6rem;font-size:.68rem;font-weight:800}
.destination-url-field{display:block;margin:17px 0 0;color:#42556b;font-size:.78rem;font-weight:750}.destination-url-field input{display:block;width:100%;margin-top:7px;border:1px solid #b9cde3;background:#fbfdff;border-radius:9px;padding:.78rem .85rem;color:var(--ink);font-size:.88rem}.destination-url-field input:focus,.destination-header-fields input:focus,.destination-secret-row>input:focus{border-color:var(--blue);outline:3px solid #2563eb18}.destination-url-field small{display:block;margin-top:6px;color:var(--muted);font-size:.68rem;font-weight:500}
.destination-advanced{margin-top:17px;border-top:1px solid var(--line);padding-top:13px}.destination-advanced summary{display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer;list-style:none;color:#263d55}.destination-advanced summary::-webkit-details-marker{display:none}.destination-advanced summary span{display:grid;gap:3px}.destination-advanced summary small{color:var(--muted);font-size:.7rem;font-weight:500}.destination-advanced summary i{font-style:normal;color:var(--muted);font-size:1.1rem}.destination-advanced[open] summary i{transform:rotate(180deg)}
.destination-settings{display:grid;gap:16px;margin-top:15px}.destination-setting-block{border:1px solid #d6e2f3;border-radius:10px;background:#f8fbff;padding:13px}.destination-setting-title{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:10px}.destination-setting-title div{display:grid;gap:3px}.destination-setting-title b{font-size:.78rem;color:#263d55}.destination-setting-title small{font-size:.68rem;color:var(--muted);line-height:1.35}.destination-setting-title>span{color:#7990ad;font-size:.67rem;font-weight:750;white-space:nowrap}
.destination-header-row{position:relative;background:#fff;border:1px solid #d6e2f3;border-radius:8px;padding:10px 38px 10px 10px;margin-top:8px}.destination-header-row:first-child{margin-top:0}.destination-header-fields{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(180px,1.2fr);gap:9px}.destination-header-fields label{display:block;color:#52657a;font-size:.68rem;font-weight:750}.destination-header-fields input,.destination-secret-row>input{display:block;width:100%;margin-top:5px;border:1px solid #cdd9e6;background:#fbfdff;border-radius:7px;padding:.55rem .6rem;color:var(--ink);font-size:.75rem;min-width:0}.destination-value-wrap,.destination-secret-row{display:flex;gap:6px;align-items:flex-end}.destination-value-wrap input,.destination-secret-row>input{flex:1;min-width:0}.show-destination-value{flex:0 0 auto;background:#f5f8fc;border:1px solid #cdd9e6;border-radius:7px;color:#49647f;padding:.53rem .55rem;font-size:.66rem;font-weight:750}.show-destination-value:hover{background:#eaf2ff;color:var(--blue)}.remove-destination-header{position:absolute;right:7px;top:8px;padding:.25rem .42rem!important}.destination-header-note{display:block;margin-top:7px;color:#7990ad;font-size:.65rem;line-height:1.35}.destination-clear{margin-top:7px!important;white-space:nowrap;font-size:.68rem!important}

/* Relay management */
.relay-actions{flex-wrap:wrap;justify-content:flex-end}.relay-actions .danger{color:#a33b3b;border-color:#efcaca;background:#fff8f8}.relay-actions .danger:hover{background:#fff0f0;color:#8d2222}.danger-box{border:1px solid #efcaca;background:#fff6f6;border-radius:10px;padding:14px;color:#7e2525}.danger-box b{display:block;margin-bottom:5px}.danger-box p{margin:0;color:#944747;font-size:.8rem;line-height:1.45}.danger-button{background:#c93636;color:#fff;font-weight:750;padding:.72rem .95rem;border-radius:9px}.danger-button:hover{background:#a92525}.edit-advanced{margin-top:16px}.edit-advanced p{margin:9px 0}.secret-edit-row{display:flex;align-items:flex-end;gap:7px}.secret-edit-row input{flex:1;min-width:0}.secret-edit-row .show-destination-value,.secret-edit-row .secondary{margin-bottom:0;white-space:nowrap}
.relay-webhook{display:flex;align-items:center;gap:7px;min-width:0;margin-top:2px}.relay-method{flex:0 0 auto;color:#7990ad;font-size:.63rem;font-weight:850;letter-spacing:.06em}.relay-webhook code{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3;color:#516a84;font-size:.72rem}.copy-webhook{flex:0 0 auto;background:#f5f8fc;border:1px solid #d6e2f3;color:#49647f;border-radius:6px;padding:.25rem .45rem;font-size:.63rem;font-weight:750}.copy-webhook:hover{background:#eaf2ff;color:var(--blue)}.form-help{display:block;color:var(--muted);font-size:.68rem;font-weight:500;line-height:1.4;margin-top:6px}
@media(max-width:760px){.relay-actions{justify-content:flex-start}.secret-edit-row{flex-wrap:wrap}.secret-edit-row input{flex-basis:100%}}

@media(max-width:620px){
  .smart-suggestion{grid-template-columns:auto 1fr}
  .smart-suggestion button{grid-column:span 2}
  .native-signal-shape{grid-template-columns:1fr 1fr}
  .vision-preview-grid{grid-template-columns:1fr}
  .mock-signal-detail-grid{grid-template-columns:1fr}
  .preview-showcase-head{display:block}
  .preview-note{display:inline-block;margin-top:10px}
}

/* Route step */
.route-connection-card,.route-destination-card{margin-bottom:16px}
.route-connection-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.route-connection-fields label,.route-destination-card>label,.rule-target label{display:block;color:#42556b;font-size:.78rem;font-weight:750}
.route-connection-fields select,.route-destination-card select,.route-rule select,.route-rule input,.rule-target select{display:block;width:100%;margin-top:7px;border:1px solid #cdd9e6;background:#fbfdff;border-radius:8px;padding:.68rem;color:var(--ink);min-width:0}
.route-status{margin-top:10px;color:var(--muted);font-size:.78rem}
.route-picker{margin-top:13px;border:1px solid #d6e2f3;border-radius:10px;background:#f8fbff;padding:12px}
.route-picker.disabled{opacity:.8}
.route-picker-head,.route-rule-head,.route-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.route-picker-head span{color:var(--muted);font-size:.72rem}
.route-all-row{display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:center;margin:12px 0;padding:10px;border:1px solid #d6e2f3;border-radius:8px;background:#fff}
.route-all-row input{grid-row:span 2}
.route-all-row b{font-size:.79rem;color:#263d55}.route-all-row small{color:var(--muted);font-size:.7rem}
.route-tags{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin:10px 0}
.route-label-small{font-size:.68rem;color:var(--muted);font-weight:750;margin-right:3px}
.route-tag,.route-tag-button{display:inline-flex;align-items:center;gap:5px;border:1px solid #b9d8df;border-radius:999px;background:#eaf8f9;color:#087c84;padding:.34rem .55rem;font-size:.7rem;font-weight:750}
.route-tag small{font-size:.62rem;color:#247d83}.route-tag input{margin:0}
.route-tag-button{cursor:pointer}.route-tag-button:hover{background:#d4f0f1}
.route-camera-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(235px,1fr));gap:7px;max-height:300px;overflow:auto;padding-right:3px}
.route-camera-row{display:block;padding:9px;border:1px solid #d6e2f3;border-radius:8px;background:#fff}.route-camera-row:hover{border-color:#8db4da}.route-camera-main{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:start;cursor:pointer}.route-camera-main input{margin-top:3px}.route-camera-row b{display:block;color:#263d55;font-size:.74rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.route-camera-row small{display:block;color:var(--muted);font-size:.64rem;line-height:1.35;word-break:break-word}.imager-choice{display:flex;align-items:center;gap:7px;margin:8px 0 0 23px;padding-top:8px;border-top:1px solid #e3ebf4;color:var(--muted);font-size:.66rem;font-weight:750}.imager-choice select{margin:0;padding:.35rem .45rem;border:1px solid #cdd9e6;border-radius:6px;background:#fbfdff;color:var(--ink);font-size:.68rem}
.route-network-wide{display:flex;gap:9px;align-items:flex-start;padding:12px;background:#fff;border:1px solid #d6e2f3;border-radius:8px;color:#2455a8}.route-network-wide span{display:grid;gap:3px}.route-network-wide b{font-size:.78rem}.route-network-wide small{font-size:.7rem;color:var(--muted);line-height:1.4}.route-network-wide.compact{font-size:.76rem}.route-network-wide.compact span{display:block}
.route-summary{margin-top:9px;color:#2455a8;font-size:.74rem;font-weight:750}
.route-empty{padding:16px;text-align:center;color:var(--muted);font-size:.76rem}.route-empty-large{border:1px dashed #c7d7e8;border-radius:10px;background:#fbfdff}
.route-rules-section{margin:18px 0}.route-section-head{margin-bottom:10px}.route-section-head h3{margin:0 0 3px}.route-section-head p{margin:0;font-size:.75rem}.route-rule{display:block;position:relative;margin-bottom:12px;overflow:hidden}.route-rule-head{align-items:center}.route-rule-head>div{display:flex;align-items:center;gap:10px;min-width:0}.route-rule-name{margin:0!important;width:180px!important;padding:.35rem .45rem!important;border:0!important;border-bottom:1px solid #bfd0e1!important;background:transparent!important;font-weight:750}.route-rule-name:focus{border-bottom-color:var(--blue)!important;outline:0}
.route-condition-list{display:grid;gap:7px;margin-top:10px}.route-condition-row{display:grid;grid-template-columns:minmax(180px,1.35fr) minmax(145px,.9fr) minmax(145px,.9fr) auto;gap:8px;align-items:center;width:100%}.route-condition-row select,.route-condition-row input{margin-top:0}.route-condition-row .icon-button{align-self:center}.route-rule-actions{display:flex;align-items:center;gap:12px;margin:9px 0 13px}.condition-mode{width:auto!important;display:inline-block!important;margin:0!important;padding:.4rem .55rem!important;font-size:.7rem}.add-condition{font-size:.72rem}.rule-target{border-top:1px solid var(--line);padding-top:14px;margin-top:3px}.rule-target>label{max-width:360px}.rule-target-picker{margin-top:9px;border:1px solid #d6e2f3;border-radius:10px;background:#f8fbff;padding:12px}.rule-target-picker.disabled{opacity:.8}
.route-connection-card #route-connect{margin-top:14px}
.route-camera-line{display:flex;align-items:flex-start;gap:8px}.route-camera-line .route-camera-main{flex:1;min-width:0}.camera-info{flex:0 0 auto;width:23px;height:23px;padding:0;border:1px solid #b8c9dc;border-radius:50%;background:#f5f8fc;color:#49647f;font-size:.72rem;font-weight:850;line-height:21px;text-align:center}.camera-info:hover{background:#eaf2ff;color:var(--blue);border-color:#8db4da}.snapshot-panel{margin:9px 0 0 23px;border-top:1px solid #e3ebf4;padding-top:8px}.snapshot-panel img{display:block;width:100%;max-height:160px;object-fit:cover;border-radius:7px;background:#e9eff6}.snapshot-panel small{display:block;color:var(--muted);font-size:.62rem;margin-top:5px}.snapshot-placeholder{display:block;background:#f5f8fc;border:1px dashed #c9d7e5;border-radius:7px;padding:10px;color:var(--muted);font-size:.68rem;line-height:1.35}
@media(max-width:760px){.route-connection-fields{grid-template-columns:1fr}.route-condition-row{grid-template-columns:1fr 1fr}.route-condition-row input{grid-column:1 / -1}.route-rule-name{width:145px!important}.route-rule-head>div{min-width:0;flex:1}.route-rule-name{max-width:calc(100vw - 170px)}}

.route-do-not-forward{display:flex;gap:9px;align-items:flex-start;padding:12px;background:#fff8ed;border:1px solid #ecd5a9;border-radius:8px;color:#8a5b12}.route-do-not-forward span{display:grid;gap:3px}.route-do-not-forward b{font-size:.78rem}.route-do-not-forward small{font-size:.7rem;color:#956f35;line-height:1.4}
.route-section-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.history-failure{display:grid;gap:4px;margin-bottom:12px;padding:10px 12px;border:1px solid #efcaca;border-radius:8px;background:#fff5f5;color:#8d2b2b;font-size:.74rem}.history-failure span{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.68rem;word-break:break-word}.history-failed>summary{background:#fffafa}.history-failed>summary:hover{background:#fff1f1}
.history-list{display:grid;gap:8px}.history-entry{border:1px solid #d6e2f3;border-radius:10px;background:#fbfdff;overflow:hidden}.history-entry summary{list-style:none;cursor:pointer;padding:11px 13px}.history-entry summary::-webkit-details-marker{display:none}.history-entry summary:hover{background:#f4f8ff}.history-entry-summary{display:grid;grid-template-columns:minmax(120px,.8fr) minmax(80px,.5fr) minmax(150px,1fr) minmax(120px,.8fr);gap:10px;align-items:center}.history-entry-summary small,.history-entry-detail label{display:block;color:var(--muted);font-size:.66rem;font-weight:650}.history-entry-summary b{display:block;color:#263d55;font-size:.74rem;margin-top:2px;word-break:break-word}.history-entry-body{border-top:1px solid #d6e2f3;padding:13px;background:#fff}.history-route-summary{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:12px}.history-route-chip{border-radius:999px;background:#eaf8f9;color:#087c84;padding:.34rem .55rem;font-size:.68rem;font-weight:750}.history-entry-detail{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}.history-entry-detail pre{max-height:220px;overflow:auto;margin:6px 0 0;padding:10px;background:#172d49;color:#dce9f6;border-radius:7px;font:11px ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap}.history-copy{margin-top:7px;padding:.35rem .55rem;border:1px solid #d6e2f3;border-radius:6px;background:#f5f8fc;color:#49647f;font-size:.66rem;font-weight:750}.history-copy:hover{background:#eaf2ff;color:var(--blue)}
@media(max-width:760px){.history-entry-summary,.history-entry-detail{grid-template-columns:1fr 1fr}}