:root {
  color-scheme: dark;
  --content-width: 1240px;
  --ink: #edf9f7;
  --muted: #88a09f;
  --line: rgba(255,255,255,.1);
  --panel: rgba(8, 27, 31, .9);
  --canvas: #050708;
  --navy: #0c666a;
  --cyan: #2dd4bf;
  --cyan-soft: rgba(45,212,191,.11);
  --green: #20b486;
  --green-strong: #2dd4a0;
  --green-soft: rgba(32,180,134,.12);
  --red: #fb7185;
  --red-soft: rgba(244,63,94,.11);
  --amber: #fbbf24;
  --amber-soft: rgba(251,191,36,.11);
  --shadow: 0 24px 70px rgba(0, 0, 0, .34);
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }

body {
  margin: 0;
  min-width: 320px;
  background:
    radial-gradient(circle at 82% 3%, rgba(19, 148, 154, .16), transparent 35%),
    radial-gradient(circle at 8% 42%, rgba(13, 91, 96, .1), transparent 32%),
    var(--canvas);
  color: var(--ink);
  font-family: "Microsoft YaHei UI", "PingFang SC", system-ui, sans-serif;
}

.topbar {
  background: rgba(5, 12, 14, .9);
  backdrop-filter: blur(18px);
  color: #fff;
  border-bottom: 1px solid rgba(45,212,191,.2);
}

.topbar__inner {
  width: min(var(--content-width), calc(100% - 40px));
  margin: 0 auto;
  padding: 20px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

h1, h2, p { margin-top: 0; }
h1 { margin-bottom: 8px; font-size: clamp(25px, 3vw, 36px); letter-spacing: .02em; }
h2 { margin: 0; font-size: 20px; }
.subtitle { margin-bottom: 0; color: #cbd9e7; font-size: 14px; }
.eyebrow { margin-bottom: 6px; color: #55dfcf; font-size: 12px; font-weight: 800; letter-spacing: .13em; }
.mode-badge, .rule-chip {
  white-space: nowrap;
  border: 1px solid rgba(255,255,255,.27);
  border-radius: 999px;
  padding: 8px 13px;
  font-size: 12px;
  font-weight: 700;
}

.brand-block { display: flex; align-items: center; gap: 24px; }
.brand-link { display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; white-space: nowrap; font-size: 17px; font-weight: 800; }
.brand-link img { width: 38px; height: 38px; border-radius: 11px; object-fit: cover; }
.account-actions { display: flex; align-items: center; gap: 12px; }
.theme-switch { height: 34px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; border: 1px solid rgba(45,212,191,.26); border-radius: 9px; padding: 0 11px; color: #a9eae2; background: rgba(45,212,191,.06); font: inherit; font-size: 12px; font-weight: 750; cursor: pointer; }
.theme-switch:hover { border-color: rgba(45,212,191,.5); background: rgba(45,212,191,.11); color: #fff; }
.theme-switch span:first-child { font-size: 15px; line-height: 1; }
.back-link, .access-gate a { border: 1px solid rgba(45,212,191,.3); border-radius: 9px; padding: 8px 13px; color: #9ff4e9; text-decoration: none; font-size: 12px; font-weight: 700; }
.logout-link { font: inherit; cursor: pointer; background: transparent; }
.back-link { white-space: nowrap; }
.back-link:hover, .access-gate a:hover { background: rgba(45,212,191,.1); }

.page-shell { width: min(var(--content-width), calc(100% - 40px)); margin: 28px auto 60px; }
.panel { background: var(--panel); border: 1px solid rgba(255,255,255,.1); border-radius: 18px; padding: 26px; box-shadow: var(--shadow); backdrop-filter: blur(16px); }

.section-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding-bottom: 17px;
  border-bottom: 1px solid var(--line);
}

.section-heading > div { display: flex; align-items: center; gap: 10px; }
.section-heading--spaced { margin-top: 31px; }
.step { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; background: var(--navy); color: #fff; font-size: 12px; font-weight: 800; }
.draft-state { color: var(--muted); font-size: 12px; }
.rule-chip { border-color: rgba(45,212,191,.28); background: rgba(45,212,191,.08); color: #7eeadb; }

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  padding-top: 21px;
}

.field { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.field--wide { grid-column: 1 / -1; }
.field > span, .field > label { font-size: 13px; font-weight: 750; }
.field b { color: var(--red); }
.field small { color: var(--muted); font-size: 12px; line-height: 1.55; }
code { padding: 1px 5px; border-radius: 4px; background: rgba(255,255,255,.07); color: #8fe8df; font-family: Consolas, monospace; }

input, select {
  width: 100%;
  height: 43px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 9px;
  background: rgba(0,0,0,.22);
  color: var(--ink);
  padding: 0 12px;
  font: inherit;
  outline: none;
  transition: border-color .16s, box-shadow .16s;
}

input:focus, select:focus { border-color: var(--cyan); box-shadow: 0 0 0 3px rgba(8,127,140,.12); }
.datetime-fields { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(150px, .72fr); gap: 12px; }
.datetime-fields .picker-field {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  min-height: 62px;
  padding: 8px 12px 7px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 11px;
  background: linear-gradient(145deg, rgba(12,45,49,.7), rgba(0,0,0,.22));
  cursor: pointer;
  transition: border-color .16s, box-shadow .16s, background .16s, transform .16s;
}
.datetime-fields .picker-field:hover { border-color: rgba(45,212,191,.52); background: rgba(10,43,47,.9); }
.datetime-fields .picker-field:focus-within { border-color: var(--cyan); box-shadow: 0 0 0 3px rgba(45,212,191,.12); transform: translateY(-1px); }
.datetime-fields .picker-label { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: #8fa8a6; font-size: 11px; font-weight: 750; pointer-events: none; }
.datetime-fields .picker-label em { color: #5bcfc2; font-size: 10px; font-style: normal; font-weight: 650; opacity: .8; }
.datetime-fields .picker-field input {
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #f1fffd;
  cursor: pointer;
  font-family: Consolas, "Microsoft YaHei UI", sans-serif;
  font-size: 15px;
  font-weight: 700;
}
.datetime-fields .picker-field input:focus { border: 0; box-shadow: none; }
.datetime-fields .picker-field input { padding-right: 29px; }
.datetime-fields .picker-field::after { position: absolute; right: 12px; bottom: 12px; color: #9bd8d2; font-size: 17px; line-height: 1; pointer-events: none; }
.datetime-fields .picker-field--date::after { content: "▦"; }
.datetime-fields .picker-field--time::after { content: "◷"; }
.datetime-fields--compact { grid-template-columns: minmax(145px, 1fr) minmax(128px, .78fr); gap: 8px; }
.datetime-fields--compact .picker-label em { display: none; }
.room-result { align-self: flex-start; padding: 6px 10px; border-radius: 7px; background: rgba(255,255,255,.06); color: var(--muted); font-size: 12px; }
.room-result.is-valid { background: var(--green-soft); color: var(--green); font-weight: 750; }
.room-result.is-error { background: var(--red-soft); color: var(--red); }

.row-editor {
  display: grid;
  grid-template-columns: minmax(220px, 1.1fr) minmax(130px, .55fr) minmax(300px, 1.45fr) minmax(210px, 1fr) auto;
  gap: 13px;
  align-items: start;
  margin-top: 21px;
  padding: 17px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 12px;
  background: rgba(0,0,0,.16);
}

.host-field { position: relative; }
.suggestions {
  position: absolute;
  z-index: 10;
  top: 69px;
  left: 0;
  right: 0;
  max-height: 255px;
  overflow: auto;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 10px;
  background: #0b2024;
  box-shadow: 0 12px 28px rgba(20,38,60,.16);
}

.suggestion { display: flex; align-items: center; border-bottom: 1px solid rgba(255,255,255,.08); }
.suggestion:last-child { border-bottom: 0; }
.suggestion__pick { flex: 1; padding: 10px 12px; border: 0; background: transparent; color: var(--ink); text-align: left; cursor: pointer; }
.suggestion__pick:hover { background: var(--cyan-soft); }
.suggestion__count { color: var(--muted); font-size: 11px; }
.suggestion__delete { width: 35px; height: 35px; border: 0; border-radius: 7px; background: transparent; color: var(--red); cursor: pointer; }
.suggestion__delete:hover { background: var(--red-soft); }

.timeline-wrap { margin-top: 18px; overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; }
.timeline { width: 100%; min-width: 880px; border-collapse: collapse; }
.timeline th { padding: 11px 10px; background: rgba(255,255,255,.055); color: #a5bcba; font-size: 12px; text-align: left; white-space: nowrap; }
.timeline td { padding: 9px 8px; border-top: 1px solid rgba(255,255,255,.07); vertical-align: middle; }
.timeline td:first-child { width: 58px; color: var(--muted); text-align: center; }
.timeline input, .timeline select { height: 38px; min-width: 110px; }
.timeline .date-input { min-width: 154px; font-family: Consolas, monospace; }
.timeline .time-input { min-width: 132px; font-family: Consolas, monospace; }
.timeline input[data-picker-type] { border-color: rgba(45,212,191,.2); background: rgba(7,39,43,.72); cursor: pointer; }
.timeline input[data-picker-type]:hover { border-color: rgba(45,212,191,.5); }
.status-up { color: #5eead4; font-weight: 750; }
.status-down { color: var(--amber); font-weight: 750; }
.empty-state { padding: 38px; display: flex; flex-direction: column; align-items: center; gap: 7px; color: #506277; }
.empty-state small { color: var(--muted); }

.button { min-height: 42px; border: 1px solid transparent; border-radius: 9px; padding: 0 17px; font: inherit; font-size: 13px; font-weight: 750; cursor: pointer; transition: transform .12s, filter .12s, background .12s; }
.button:hover { filter: brightness(.97); transform: translateY(-1px); }
.button:disabled { cursor: wait; opacity: .6; transform: none; }
.button--add { align-self: start; margin-top: 24px; background: #16b879; color: #fff; }
.button--secondary { border-color: rgba(255,255,255,.15); background: rgba(255,255,255,.07); color: #c9d8d7; }
.button--check { border-color: rgba(45,212,191,.3); background: rgba(45,212,191,.1); color: #8ceadf; }
.button--submit { background: var(--green); color: #fff; box-shadow: 0 6px 15px rgba(8,122,85,.18); }
.button--submit:hover { background: var(--green-strong); }
.button--danger { border-color: #e5a9b5; background: var(--red-soft); color: var(--red); }
.timeline th:last-child, .timeline td:last-child { width: 74px; white-space: nowrap; }
.remove-row { display: inline-flex; min-width: 58px; min-height: 34px; align-items: center; justify-content: center; padding: 0 11px; border-color: rgba(251,113,133,.3); background: var(--red-soft); color: var(--red); white-space: nowrap; }

.message { display: none; margin-top: 16px; padding: 12px 14px; border-radius: 9px; white-space: pre-line; font-size: 13px; line-height: 1.6; }
.message.is-success { display: block; background: var(--green-soft); color: var(--green); }
.message.is-error { display: block; background: var(--red-soft); color: var(--red); }
.message.is-info { display: block; background: rgba(56,189,248,.1); color: #8edcff; }

.actions { margin-top: 21px; display: flex; justify-content: space-between; gap: 14px; }
.actions__right { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.submit-warning { margin: 16px 0 0; color: #8b5a16; font-size: 12px; text-align: right; }

.receipt { max-width: 760px; margin: 70px auto; text-align: center; }
.receipt__icon { display: grid; place-items: center; width: 68px; height: 68px; margin: 0 auto 18px; border-radius: 50%; background: var(--green-soft); color: var(--green); font-size: 34px; font-weight: 900; }
.receipt h2 { margin-bottom: 12px; font-size: 28px; }
.receipt dl { margin: 25px 0; border: 1px solid var(--line); border-radius: 12px; text-align: left; overflow: hidden; }
.receipt dl div { display: grid; grid-template-columns: 150px 1fr; padding: 12px 16px; border-top: 1px solid var(--line); }
.receipt dl div:first-child { border-top: 0; }
.receipt dt { color: var(--muted); }
.receipt dd { margin: 0; font-weight: 700; word-break: break-word; }
.success-text { color: var(--green); }

body.picker-open { overflow: hidden; }
.datetime-picker { position: fixed; inset: 0; z-index: 1200; display: grid; place-items: center; padding: 20px; }
.datetime-picker__backdrop { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: rgba(0,8,10,.78); backdrop-filter: blur(8px); cursor: default; }
.datetime-picker__dialog { position: relative; width: min(440px, 100%); overflow: hidden; border: 1px solid rgba(45,212,191,.27); border-radius: 20px; background: #081b1f; box-shadow: 0 30px 90px rgba(0,0,0,.58); }
.datetime-picker__header { display: flex; align-items: center; justify-content: space-between; padding: 20px 22px 16px; border-bottom: 1px solid rgba(255,255,255,.09); }
.datetime-picker__header h2 { margin-top: 4px; font-size: 21px; }
.datetime-picker__eyebrow { color: #5eead4; font-size: 10px; font-weight: 800; letter-spacing: .16em; }
.datetime-picker__close { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid rgba(255,255,255,.12); border-radius: 10px; background: rgba(255,255,255,.05); color: #aac1bf; font-size: 24px; line-height: 1; cursor: pointer; }
.datetime-picker__close:hover { border-color: rgba(45,212,191,.4); background: rgba(45,212,191,.1); color: #fff; }
.calendar-picker { padding: 18px 22px 8px; }
.calendar-picker__toolbar { display: grid; grid-template-columns: 38px 1fr 38px; align-items: center; gap: 10px; margin-bottom: 13px; }
.calendar-picker__toolbar strong { text-align: center; font-size: 15px; }
.calendar-picker__toolbar button { width: 38px; height: 34px; border: 1px solid rgba(255,255,255,.1); border-radius: 9px; background: rgba(255,255,255,.05); color: #b9cecc; font-size: 22px; cursor: pointer; }
.calendar-picker__toolbar button:hover { border-color: rgba(45,212,191,.42); background: rgba(45,212,191,.1); color: #fff; }
.calendar-picker__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 5px; }
.calendar-picker__weekday { padding: 5px 0 7px; color: #708b89; font-size: 10px; font-weight: 800; text-align: center; }
.calendar-picker__day { aspect-ratio: 1; min-height: 38px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: #dcecea; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.calendar-picker__day:hover { border-color: rgba(45,212,191,.36); background: rgba(45,212,191,.1); }
.calendar-picker__day.is-today { border-color: rgba(45,212,191,.3); color: #5eead4; }
.calendar-picker__day.is-selected { border-color: #2dd4bf; background: linear-gradient(135deg, #0f8a86, #16a37f); color: #fff; box-shadow: 0 6px 18px rgba(16,163,127,.24); }
.calendar-picker__blank { min-height: 38px; }
.time-picker { padding: 20px 22px 8px; }
.time-picker__preview { display: block; margin-bottom: 17px; color: #eafffc; font-family: Consolas, monospace; font-size: 34px; font-weight: 800; letter-spacing: .08em; text-align: center; }
.time-picker__columns { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: 8px; }
.time-picker__columns > b { color: #5eead4; font-size: 22px; }
.time-picker__columns label { display: flex; flex-direction: column; gap: 7px; }
.time-picker__columns label > span { color: #88a09f; font-size: 11px; font-weight: 750; text-align: center; }
.time-picker__columns select { height: 210px; padding: 5px; border-color: rgba(255,255,255,.1); border-radius: 11px; background: rgba(0,0,0,.2); scrollbar-color: #267873 transparent; }
.time-picker__columns option { margin: 2px 0; padding: 8px 3px; border-radius: 7px; color: #b7ccca; font-family: Consolas, monospace; font-size: 14px; text-align: center; }
.time-picker__columns option:checked { background: #147b75 linear-gradient(0deg, #147b75 0%, #147b75 100%); color: #fff; }
.datetime-picker__footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 17px 22px 20px; }
.datetime-picker__footer > div { display: flex; gap: 9px; }
.datetime-picker__footer .button { min-width: 76px; }

.access-gate { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 20px; background: rgba(3,8,9,.94); backdrop-filter: blur(16px); }
.access-gate__card { width: min(430px, 100%); border: 1px solid rgba(45,212,191,.2); border-radius: 20px; padding: 34px; background: #091b1f; box-shadow: var(--shadow); text-align: center; }
.access-gate__card strong { display: block; margin-top: 17px; font-size: 20px; }
.access-gate__card p { margin: 10px 0 20px; color: var(--muted); font-size: 14px; line-height: 1.7; }
.access-gate__spinner { width: 34px; height: 34px; margin: 0 auto; border: 3px solid rgba(45,212,191,.16); border-top-color: #2dd4bf; border-radius: 50%; animation: spin .8s linear infinite; }
body.auth-pending > :not(.access-gate) { visibility: hidden; }
@keyframes spin { to { transform: rotate(360deg); } }

.submit-progress { position: fixed; inset: 0; z-index: 1500; display: grid; place-items: center; padding: 20px; background: rgba(2,10,12,.72); backdrop-filter: blur(7px); }
.submit-progress__card { width: min(430px, 100%); border: 1px solid rgba(45,212,191,.24); border-radius: 18px; padding: 25px 24px; background: #091b1f; box-shadow: var(--shadow); }
.submit-progress__card strong { display: block; font-size: 18px; }
.submit-progress__card p { margin: 9px 0 18px; color: var(--muted); font-size: 13px; line-height: 1.65; }
.submit-progress__track { height: 8px; overflow: hidden; border-radius: 999px; background: rgba(45,212,191,.12); }
.submit-progress__track span { display: block; width: 38%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #0f8a86, #2dd4bf, #20b486); animation: progress-slide 1.35s ease-in-out infinite; }
.submit-progress.is-complete .submit-progress__track span { width: 100%; animation: none; transition: width .2s ease; }
@keyframes progress-slide { 0% { transform: translateX(-110%); } 100% { transform: translateX(290%); } }

.page-transition { position: fixed; inset: 0; z-index: 1600; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; background: rgba(3,10,12,.78); backdrop-filter: blur(8px); }
.page-transition__spinner { width: 46px; height: 46px; border: 4px solid rgba(45,212,191,.18); border-top-color: #2dd4bf; border-radius: 50%; animation: spin .72s linear infinite; }
.page-transition span { color: #c9e5e1; font-size: 13px; font-weight: 750; letter-spacing: .04em; }

@media (max-width: 1120px) {
  .row-editor { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .button--add { min-height: 43px; margin-top: 0; }
}

@media (max-width: 650px) {
  .topbar__inner, .page-shell { width: min(100% - 24px, var(--content-width)); }
  .topbar__inner { align-items: flex-start; padding: 20px 0; }
  .brand-block { align-items: flex-start; gap: 8px; }
  .brand-link span { display: none; }
  .brand-link img { width: 34px; height: 34px; }
  h1 { font-size: 22px; white-space: nowrap; }
  .account-actions { flex-direction: column; align-items: flex-end; }
  .mode-badge { display: none; }
  .theme-switch span:last-child { display: none; }
  .theme-switch { width: 34px; padding: 0; }
  .panel { padding: 18px 14px; border-radius: 12px; }
  .form-grid, .row-editor { grid-template-columns: 1fr; }
  .datetime-fields, .datetime-fields--compact { grid-template-columns: 1fr 1fr; }
  .field--wide { grid-column: auto; }
  .section-heading { align-items: flex-start; }
  .draft-state, .rule-chip { display: none; }
  .actions { flex-direction: column-reverse; }
  .actions__right { display: grid; grid-template-columns: 1fr 1fr; }
  .button--submit { grid-column: 1 / -1; }
  .submit-warning { text-align: left; }
  .receipt dl div { grid-template-columns: 1fr; gap: 4px; }
  .datetime-picker { padding: 10px; }
  .datetime-picker__dialog { border-radius: 16px; }
  .datetime-picker__header, .datetime-picker__footer { padding-left: 16px; padding-right: 16px; }
  .calendar-picker, .time-picker { padding-left: 16px; padding-right: 16px; }
  .calendar-picker__day { min-height: 36px; }
  .time-picker__columns select { height: 190px; }
}

html[data-theme="light"] {
  color-scheme: light;
  --ink: #183438;
  --muted: #627b7e;
  --line: rgba(24,79,85,.15);
  --panel: rgba(255,255,255,.93);
  --canvas: #edf4f3;
  --navy: #0d817d;
  --cyan: #0d918a;
  --cyan-soft: rgba(13,145,138,.1);
  --green: #087c5d;
  --green-strong: #07694f;
  --green-soft: rgba(8,124,93,.1);
  --red: #c43f57;
  --red-soft: rgba(196,63,87,.09);
  --amber: #9a670d;
  --amber-soft: rgba(154,103,13,.1);
  --shadow: 0 20px 55px rgba(31,68,72,.11);
}

html[data-theme="light"] body {
  background:
    radial-gradient(circle at 82% 3%, rgba(13,145,138,.1), transparent 35%),
    radial-gradient(circle at 8% 42%, rgba(13,91,96,.06), transparent 32%),
    var(--canvas);
}
html[data-theme="light"] .topbar { color: var(--ink); border-bottom-color: rgba(13,145,138,.18); background: rgba(250,253,252,.93); }
html[data-theme="light"] .brand-link { color: #172b2f; }
html[data-theme="light"] .subtitle { color: #567074; }
html[data-theme="light"] .eyebrow { color: #087f7a; }
html[data-theme="light"] .mode-badge { border-color: rgba(24,79,85,.22); }
html[data-theme="light"] .theme-switch,
html[data-theme="light"] .back-link,
html[data-theme="light"] .access-gate a { color: #087f7a; border-color: rgba(13,145,138,.25); background: rgba(13,145,138,.06); }
html[data-theme="light"] .panel { border-color: rgba(24,79,85,.14); }
html[data-theme="light"] code { color: #087f7a; background: rgba(13,145,138,.09); }
html[data-theme="light"] input,
html[data-theme="light"] select { color: var(--ink); border-color: rgba(24,79,85,.2); background: rgba(255,255,255,.92); }
html[data-theme="light"] .datetime-fields .picker-field { border-color: rgba(24,79,85,.18); background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(231,242,240,.88)); }
html[data-theme="light"] .datetime-fields .picker-field:hover { border-color: rgba(13,145,138,.46); background: #fff; }
html[data-theme="light"] .datetime-fields .picker-label { color: #627b7e; }
html[data-theme="light"] .datetime-fields .picker-label em { color: #087f7a; }
html[data-theme="light"] .datetime-fields .picker-field input { color: #183438; background: transparent; }
html[data-theme="light"] .datetime-fields .picker-field::after { color: #0d817d; }
html[data-theme="light"] .room-result { background: rgba(13,145,138,.07); }
html[data-theme="light"] .row-editor { border-color: rgba(24,79,85,.13); background: rgba(229,239,238,.6); }
html[data-theme="light"] .suggestions { border-color: rgba(24,79,85,.16); background: #fff; }
html[data-theme="light"] .suggestion { border-bottom-color: rgba(24,79,85,.1); }
html[data-theme="light"] .timeline th { color: #526d71; background: rgba(13,145,138,.07); }
html[data-theme="light"] .timeline td { border-top-color: rgba(24,79,85,.1); }
html[data-theme="light"] .timeline input[data-picker-type] { border-color: rgba(13,145,138,.2); background: #fff; }
html[data-theme="light"] .button--secondary { color: #38565b; border-color: rgba(24,79,85,.17); background: rgba(24,79,85,.055); }
html[data-theme="light"] .button--check { color: #087f7a; }
html[data-theme="light"] .message.is-info { color: #0a6f8f; }
html[data-theme="light"] .datetime-picker__backdrop { background: rgba(22,43,47,.42); }
html[data-theme="light"] .datetime-picker__dialog { border-color: rgba(13,145,138,.25); background: #fafdFC; box-shadow: 0 30px 90px rgba(31,68,72,.22); }
html[data-theme="light"] .datetime-picker__header { border-bottom-color: rgba(24,79,85,.12); }
html[data-theme="light"] .datetime-picker__close,
html[data-theme="light"] .calendar-picker__toolbar button { color: #526d71; border-color: rgba(24,79,85,.14); background: rgba(24,79,85,.05); }
html[data-theme="light"] .calendar-picker__weekday { color: #73898c; }
html[data-theme="light"] .calendar-picker__day { color: #29484d; }
html[data-theme="light"] .calendar-picker__day.is-today { color: #087f7a; }
html[data-theme="light"] .time-picker__preview { color: #183438; }
html[data-theme="light"] .time-picker__columns label > span { color: #627b7e; }
html[data-theme="light"] .time-picker__columns select { border-color: rgba(24,79,85,.15); background: #fff; }
html[data-theme="light"] .time-picker__columns option { color: #38565b; }
html[data-theme="light"] .access-gate { background: rgba(237,244,243,.95); }
html[data-theme="light"] .access-gate__card { border-color: rgba(13,145,138,.2); background: #fff; }
html[data-theme="light"] .submit-progress,
html[data-theme="light"] .page-transition { background: rgba(228,239,237,.78); }
html[data-theme="light"] .submit-progress__card { border-color: rgba(13,145,138,.2); background: #fff; box-shadow: 0 24px 70px rgba(31,68,72,.2); }
html[data-theme="light"] .page-transition span { color: #245257; }
