:root{
  --auto-bg:#f4f6ff;
  --auto-surface:#ffffff;
  --auto-surface-soft:#f8faff;
  --auto-primary:#3154d5;
  --auto-primary-hover:#2747bd;
  --auto-primary-soft:#e9efff;
  --auto-ink:#172554;
  --auto-text:#26365f;
  --auto-muted:#687694;
  --auto-border:#dce5ff;
  --auto-border-strong:#c8d5fb;
  --auto-success:#087a62;
  --auto-success-soft:#e8f7f2;
  --auto-warning:#a35f00;
  --auto-warning-soft:#fff5df;
  --auto-danger:#b83a31;
  --auto-danger-soft:#fff0ee;
  --auto-shadow:0 12px 34px rgba(45,67,139,.08);
}

html,body{background:var(--auto-bg)!important;color:var(--auto-text)!important}
body{min-width:0;overflow-x:hidden}
.page{max-width:none!important;margin:0!important;padding:26px 30px 44px!important;background:var(--auto-bg)}
.head{margin-bottom:18px!important}
.head h1{color:var(--auto-ink)!important;font-size:30px!important;font-weight:800!important;letter-spacing:-.02em}
.muted,.help,.sub{color:var(--auto-muted)!important}

.btn{
  border-color:var(--auto-border-strong)!important;
  background:var(--auto-surface)!important;
  color:var(--auto-primary)!important;
  box-shadow:0 2px 5px rgba(45,67,139,.04);touch-action:manipulation;
}
.btn:hover:not(:disabled){border-color:var(--auto-primary)!important;background:var(--auto-primary-soft)!important}
.btn.primary{border-color:var(--auto-primary)!important;background:var(--auto-primary)!important;color:#fff!important;box-shadow:0 8px 20px rgba(49,84,213,.2)}
.btn.primary:hover:not(:disabled){background:var(--auto-primary-hover)!important}
.btn.danger{border-color:#f1bbb6!important;background:#fff!important;color:var(--auto-danger)!important}
.btn:focus-visible,.field:focus-visible,.input:focus-visible,.textarea:focus-visible,.select:focus-visible,.stage:focus-visible,.icon-btn:focus-visible{
  outline:3px solid rgba(49,84,213,.22)!important;outline-offset:2px!important
}

.chip{background:var(--auto-success-soft)!important;color:var(--auto-success)!important}
.chip.gray{background:#edf1fb!important;color:#5c6987!important}
.chip.warn{background:var(--auto-warning-soft)!important;color:var(--auto-warning)!important}
.chip.red{background:var(--auto-danger-soft)!important;color:var(--auto-danger)!important}
.notice{border-color:#f0d49b!important;background:var(--auto-warning-soft)!important;color:#805000!important}

.metric,.panel{
  border-color:var(--auto-border)!important;
  background:var(--auto-surface)!important;
  box-shadow:var(--auto-shadow)!important
}
.metric{position:relative;overflow:hidden}
.metric:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--auto-primary)}
.metric span{color:var(--auto-muted)!important}
.metric strong{color:var(--auto-ink)!important}
.panel h2,.panel h3,.person{color:var(--auto-ink)!important}
.table-wrap{border-color:var(--auto-border)!important;background:var(--auto-surface)}
th{background:var(--auto-surface-soft)!important;color:#536284!important}
th,td{border-color:#e8edfb!important}
tbody tr:hover{background:#fafbff}
.preview,.log p{color:var(--auto-text)!important}

.field,.input,.textarea,.select{
  border-color:var(--auto-border-strong)!important;
  background:var(--auto-surface)!important;
  color:var(--auto-text)!important
}
.field:focus,.input:focus,.textarea:focus,.select:focus{border-color:var(--auto-primary)!important;box-shadow:0 0 0 3px rgba(49,84,213,.13)!important}
.switch i{background:#cbd3e5!important}
.switch input:checked+i{background:var(--auto-primary)!important}
.toggle-row,.section{border-color:#e8edfb!important}
.switch-card,.run-box{border-color:var(--auto-border)!important;background:var(--auto-surface-soft)!important}
.check,.event,.history-item,.log{border-color:var(--auto-border)!important;background:#fff!important}
.check input{accent-color:var(--auto-primary)!important}

.stage-list{scrollbar-color:#b8c5ec transparent;scrollbar-width:thin}
.stage-list::-webkit-scrollbar{width:6px}.stage-list::-webkit-scrollbar-track{background:transparent}.stage-list::-webkit-scrollbar-thumb{background:#b8c5ec;border-radius:999px}
.stage{border-color:var(--auto-border)!important;color:var(--auto-text)!important}
.stage:hover{border-color:#9eb0ed!important;background:#fafbff!important}
.stage.active{border-color:var(--auto-primary)!important;background:var(--auto-primary-soft)!important;box-shadow:inset 3px 0 var(--auto-primary)!important}
.icon-btn{border-color:var(--auto-border-strong)!important;color:var(--auto-primary)!important}
.readonly{background:#f2f5fc!important;color:#67738d!important}
.sticky-save{border-color:var(--auto-border)!important;box-shadow:0 12px 30px rgba(45,67,139,.14)!important}
.toast{background:var(--auto-primary)!important;box-shadow:0 14px 34px rgba(31,52,130,.24)!important}
.toast.error{background:var(--auto-danger)!important}
.danger-text{color:var(--auto-danger)!important}
.modal{background:rgba(23,37,84,.42)!important}
.dialog{border:1px solid var(--auto-border);color:var(--auto-text);box-shadow:0 26px 76px rgba(23,37,84,.24)!important}

.api-error{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  margin:0 0 16px;padding:15px 17px;border:1px solid #f0b8b3;border-radius:14px;
  background:var(--auto-danger-soft);color:#7f2c27;box-shadow:0 6px 18px rgba(184,58,49,.06)
}
.api-error[hidden]{display:none!important}.api-error-copy{display:flex;align-items:flex-start;gap:12px}.api-error-icon{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:10px;background:#ffdcd8;color:var(--auto-danger);font-weight:900}.api-error b{display:block;margin-bottom:3px;color:#842c26}.api-error p{margin:0;font-size:13px;line-height:1.6}.api-error .btn{flex:0 0 auto}
.loading-state{display:flex;align-items:center;justify-content:center;gap:9px;min-height:88px;color:var(--auto-muted)}
.loading-state:before{content:"";width:17px;height:17px;border:2px solid #cbd6f5;border-top-color:var(--auto-primary);border-radius:50%;animation:auto-spin .8s linear infinite}
@keyframes auto-spin{to{transform:rotate(360deg)}}

@media(max-width:1100px){.page{padding:22px!important}}
@media(max-width:720px){.page{padding:16px 12px 30px!important}.head h1{font-size:25px!important}.btn{min-height:44px!important}.field,.input,.textarea,.select{min-height:44px!important;font-size:16px!important}.api-error{align-items:stretch;flex-direction:column}.api-error .btn{width:100%}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}