:root {
  color-scheme: light; font-family: "Segoe UI", system-ui, -apple-system, sans-serif; font-size: 14px;
  color: #1c2c44; background: #f6f8fb;
  --text: #1c2c44; --muted: #64748b; --line: #dce4ed; --blue: #2459d6; --teal: #116b6d; --sidebar-width: 248px;
}
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: wait; opacity: .58; }
button, a, summary, input, textarea, select { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, summary:focus-visible { outline: 3px solid #3d6fdd; outline-offset: 3px; }
[hidden] { display: none !important; }
.icon-definitions { position: absolute; width: 0; height: 0; overflow: hidden; }
.icon { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.skip-link { position: fixed; left: 16px; top: -80px; z-index: 20; padding: 12px 18px; border-radius: 8px; color: #fff; background: #153c68; }
.skip-link:focus { top: 12px; }
.muted, .field-hint, .small-label { color: var(--muted); }
.mono, code, .timer { font-family: "Cascadia Code", Consolas, ui-monospace, monospace; }

.sidebar { position: fixed; inset: 0 auto 0 0; z-index: 5; width: var(--sidebar-width); display: flex; flex-direction: column; padding: 30px 18px 18px; border-right: 1px solid #d4e1e5; background: linear-gradient(165deg, #d8f1ee 0%, #e9f1f1 55%, #edeff5 100%); overflow-y: auto; scrollbar-width: thin; }
.brand-row { display: flex; gap: 8px; align-items: center; justify-content: space-between; margin-bottom: 40px; }
.brand { display: flex; align-items: center; gap: 10px; min-width: 0; color: var(--text); text-decoration: none; }
.brand-mark { position: relative; display: grid; place-items: center; width: 46px; height: 46px; flex-shrink: 0; border-radius: 13px; background: #135f64; color: #fff; font-size: 15px; letter-spacing: -1px; font-weight: 800; box-shadow: 0 3px 6px #135f6414; }
.brand-mark span { position: absolute; bottom: 9px; right: 10px; width: 14px; height: 2px; background: #8ee3d1; }
.brand-copy strong, .brand-copy small { display: block; white-space: nowrap; }
.brand-copy strong { font-size: 17px; font-weight: 750; letter-spacing: -.5px; }
.brand-copy small { margin-top: 3px; font-size: 11px; color: #527477; }
.icon-button { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex-shrink: 0; border: 1px solid var(--line); border-radius: 9px; background: #fff; color: #4b5f78; }
.icon-button:hover { background: #edf3fa; color: var(--blue); }
.sidebar-toggle { width: 32px; min-height: 44px; border: 0; background: transparent; color: #507477; }
.sidebar-heading { margin: 0 12px 12px; color: #5e7e80; font-size: 10px; font-weight: 700; letter-spacing: 1.1px; white-space: nowrap; }
.tool-nav { display: flex; flex-direction: column; gap: 7px; }
.tool-tab { display: flex; align-items: center; gap: 12px; min-height: 48px; width: 100%; padding: 12px 14px; border: 0; border-radius: 8px; background: transparent; color: #354d60; text-align: left; font-size: 14px; font-weight: 550; white-space: nowrap; }
.tool-tab:hover { background: #ffffff70; }
.tool-tab.is-active { background: var(--teal); color: #fff; box-shadow: 0 3px 7px #0e5d6510; }
.nav-chevron { width: 14px; height: 14px; margin-left: auto; opacity: 0; }
.tool-tab.is-active .nav-chevron { opacity: .85; }
.admin-tab { margin-top: 13px; }
.quota-section { margin: 36px 9px 24px; }
.section-heading h2 { font-size: 10px; letter-spacing: 1px; color: #5e7e80; margin: 0 0 6px; font-weight: 700; }
.section-heading > span { font-size: 10px; line-height: 1.5; }
.quota-grid { display: grid; gap: 16px; margin-top: 19px; }
.quota-card { display: grid; grid-template-columns: 1fr auto; gap: 7px 8px; }
.quota-label { font-size: 12px; color: #4b6374; }
.quota-numbers { font-size: 12px; font-weight: 700; color: #2d485c; }
.quota-caption { grid-column: 1 / -1; font-size: 10px; color: #617c87; }
.quota-bar { grid-column: 1 / -1; width: 100%; height: 4px; border: 0; border-radius: 5px; overflow: hidden; appearance: none; background: #d2e2e5; }
.quota-bar::-webkit-progress-bar { border-radius: 5px; background: #d2e2e5; }
.quota-bar::-webkit-progress-value { border-radius: 5px; background: #388a8b; }
.quota-bar::-moz-progress-bar { border-radius: 5px; background: #388a8b; }
.quota-help { margin: 16px 0 0; font-size: 10px; line-height: 1.5; color: #647b87; }
.account-card { margin-top: auto; padding: 18px 9px 16px; border-top: 1px solid #cbdcde; }
.account-main { display: flex; align-items: center; gap: 10px; min-width: 0; }
.avatar { display: grid; place-items: center; width: 38px; height: 38px; flex-shrink: 0; border: 3px solid #fff; border-radius: 50%; background: #2c7380; color: #fff; font-size: 13px; font-weight: 700; }
.account-copy { min-width: 0; }
.account-copy h2 { margin: 0; font-size: 12px; font-weight: 650; overflow-wrap: anywhere; }
.account-copy p { margin: 4px 0 0; font-size: 10px; font-weight: 650; letter-spacing: .5px; color: #607487; }
.account-status { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.account-status .button { width: 100%; }
.badge { display: inline-block; padding: 5px 9px; border-radius: 6px; font-size: 10px; font-weight: 650; line-height: 1.4; }
.badge-neutral { background: #e4eaf0; color: #4a6276; }
.badge-ok { background: #d7ede4; color: #1b6447; }
.badge-warn { background: #fff0cc; color: #805819; }
.badge-error { background: #fbe1e4; color: #9d3043; }
.account-logout { display: inline-flex; align-items: center; min-height: 26px; padding: 5px 9px; border: 1px solid #cbd8df; border-radius: 6px; color: #5f7285; font-size: 10px; font-weight: 650; line-height: 1.4; text-decoration: none; }
.account-logout:hover { border-color: #9bb7bd; background: #f6fbfa; color: #2c6970; }

.main-content { margin-left: var(--sidebar-width); padding: 36px 42px 0; }
.shell { max-width: 1440px; margin: 0 auto; }
.page-header { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 27px; }
.page-intro { min-width: 0; }
.eyebrow { margin: 0 0 8px; font-size: 10px; letter-spacing: 1.4px; font-weight: 650; color: #73869c; }
h1 { margin: 0; font-size: 30px; letter-spacing: -1px; line-height: 1.25; font-weight: 750; }
.page-description { margin: 9px 0 0; color: #60728b; font-size: 13px; line-height: 1.6; }
.header-actions { display: flex; align-items: center; gap: 13px; flex-shrink: 0; }
.connection-state { display: inline-flex; align-items: center; gap: 7px; font-size: 11px; color: #65788d; }
.connection-state::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #8d9dad; }
.connection-state.is-online { color: #346e58; }
.connection-state.is-online::before { background: #248a62; box-shadow: 0 0 0 4px #248a620c; }
.connection-state.is-error { color: #9d4050; }
.connection-state.is-error::before { background: #c25366; }
.alert { display: block; padding: 12px 16px; margin: 0 0 20px; border: 1px solid #f1d2d7; border-radius: 8px; background: #fff2f4; color: #9d3043; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.alert.is-success { border-color: #c7e7d8; background: #eef9f3; color: #226c4e; }
.tool-workspace { display: grid; grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr); gap: 20px; align-items: stretch; }
.tool-workspace.balanced { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.workspace-card { min-width: 0; border: 1px solid #ccd7e5; border-radius: 11px; background: #fff; box-shadow: 0 2px 4px #183f6b05; }
.input-card, .result-card { display: flex; flex-direction: column; min-height: max(640px, calc(100vh - 215px)); }
.card-heading { display: flex; align-items: center; gap: 12px; min-height: 91px; margin: 0 22px; padding: 18px 0; border-bottom: 1px solid #e5ebf2; }
.card-heading h2, .card-heading h3 { font-size: 16px; line-height: 1.5; font-weight: 650; margin: 0; letter-spacing: -.25px; }
.card-heading p { margin: 4px 0 0; color: #708199; font-size: 11px; line-height: 1.6; }
.card-icon { display: grid; place-items: center; width: 40px; height: 40px; flex-shrink: 0; border-radius: 12px; background: #e8f5f4; color: #217c7e; }
.card-icon-success { color: #24885e; background: #edf7f0; }
.card-icon .icon { width: 21px; height: 21px; }
.card-body { padding: 22px; }
.input-body { display: flex; flex: 1; flex-direction: column; gap: 13px; }
.field-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.field-label { display: block; margin: 0 0 9px; font-size: 12px; font-weight: 650; color: #31455e; }
.input-body > .field-label, .field-heading .field-label { margin: 0; }
.limit-note { color: #7b8ba0; font-size: 10px; }
.large-input, .text-input { width: 100%; min-width: 0; border: 1px solid #d3deeb; border-radius: 7px; background: #fff; color: var(--text); outline: none; }
.large-input { flex: 1; min-height: 300px; padding: 16px; resize: vertical; font-size: 12px; line-height: 1.9; }
.large-input::placeholder { color: #8591a3; opacity: 1; }
.text-input { padding: 11px 12px; min-height: 44px; font-size: 13px; }
.text-input::placeholder { color: #8995a6; }
.large-input:focus, .text-input:focus { border-color: #668dd7; box-shadow: 0 0 0 3px #3066da10; }
.input-meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; font-size: 10px; line-height: 1.6; color: #77869b; }
.input-meta > :first-child { color: #42658f; font-weight: 550; }
.key-preview { margin-top: 10px; padding: 10px 12px; border: 1px solid #d7e4f4; border-radius: 7px; background: #f7faff; color: #426284; font-size: 11px; line-height: 1.6; }
.key-preview[hidden] { display: none; }
.key-preview.is-empty { color: #966b1a; background: #fffaf0; border-color: #ead9ad; }
.key-preview.is-over-limit { color: #8b4e2d; background: #fff7f2; border-color: #edc7b4; }
.key-preview-heading { font-weight: 650; }
.key-preview-list { display: grid; gap: 3px; margin: 7px 0 0; padding-left: 23px; color: #2d496e; }
.key-preview-item { overflow-wrap: anywhere; }
.key-preview-warning { margin-top: 8px; color: #af3850; font-size: 10px; }
.notice, .workspace-note { display: flex; align-items: flex-start; gap: 10px; padding: 12px; border: 1px solid #d8e6fa; border-radius: 7px; background: #f4f8ff; color: #496791; font-size: 11px; line-height: 1.7; }
.notice .icon, .workspace-note .icon { width: 17px; height: 17px; margin-top: 1px; color: var(--blue); }
.action-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 0; margin: 0 22px; border-top: 1px solid #e5ebf2; }
.operation-meta { display: flex; flex-direction: column; gap: 6px; }
.timer { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-variant-numeric: tabular-nums; color: #526b8e; }
.timer .icon { width: 14px; height: 14px; }
.action-quota { font-size: 10px; color: #7a8ba0; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 44px; padding: 11px 17px; border: 1px solid transparent; border-radius: 7px; font-size: 12px; font-weight: 650; line-height: 1.5; }
.button .icon { width: 16px; height: 16px; }
.button-primary { background: #2459d6; color: #fff; box-shadow: 0 3px 8px #2459d618; }
.button-primary:hover { background: #1948b7; }
.button-secondary { background: #fff; border-color: #d5e0ed; color: #385b86; }
.button-secondary:hover { background: #f2f6fc; }
.text-button { min-height: 44px; padding: 8px 0 8px 10px; margin-left: auto; border: 0; background: transparent; color: #69809d; font-size: 11px; white-space: nowrap; }
.text-button:hover { color: var(--blue); text-decoration: underline; }
.result-content { flex: 1; min-width: 0; min-height: 300px; margin: 20px 22px 22px; padding: 16px; border: 1px solid #e0e7f0; border-radius: 7px; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.empty-state { display: grid; place-items: center; color: #78899e; font-size: 12px; text-align: center; }
.empty-state-inner { max-width: 350px; padding: 40px 12px; }
.empty-state-icon { display: grid; place-items: center; width: 58px; height: 58px; margin: 0 auto 20px; border-radius: 50%; background: #f0f5fe; color: #537bd6; }
.empty-state-icon .icon { width: 26px; height: 26px; }
.empty-state h3 { margin: 0 0 9px; color: #354c6a; font-size: 15px; font-weight: 650; }
.empty-state p { margin: 0; color: #7b8ba0; font-size: 12px; line-height: 1.8; }
.empty-state-label { display: block; margin-top: 36px; color: #a1afc0; font-size: 8px; letter-spacing: 2px; }
.result-list { display: grid; gap: 10px; }
.result-summary { margin: 0 0 12px; padding: 9px 11px; border: 1px solid #d5e5f4; border-radius: 7px; background: #f3f8fd; color: #426284; font-size: 12px; font-weight: 650; }
.pending-results { margin-top: 14px; padding-top: 14px; border-top: 1px solid #eadfca; }
.pending-results h3 { margin: 0 0 10px; color: #8b671f; font-size: 12px; font-weight: 650; }
.pending-results .result-row { border-color: #eadfca; background: #fffaf2; }
.result-row { padding: 15px; border: 1px solid #dde6f1; border-radius: 7px; background: #f9fbfe; }
.result-row-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.result-title { font-size: 12px; color: #2d496e; overflow-wrap: anywhere; }
.result-row-top > :last-child { font-size: 11px; font-weight: 650; }
.result-meta { margin-top: 10px; font-size: 12px; color: #687c96; line-height: 1.8; overflow-wrap: anywhere; }
.result-details { display: grid; grid-template-columns: 100px minmax(0, 1fr); gap: 10px 14px; margin: 20px 0 0; font-size: 12px; }
.result-details dt { color: #71839c; }
.result-details dd { margin: 0; color: #2d496e; overflow-wrap: anywhere; }
.status-ok { color: #20815a; }
.status-warn { color: #966b1a; }
.status-error { color: #af3850; }
.is-loading::before { content: ""; width: 22px; height: 22px; border: 2px solid #e0e8f5; border-top-color: var(--blue); border-radius: 50%; animation: spin .8s linear infinite; }
.is-loading { align-content: center; gap: 16px; }
.is-busy .icon { animation: pulse 1s ease-in-out infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes pulse { 50% { opacity: .3; } }

.guide { border: 1px solid #d8e6fa; border-radius: 7px; background: #f5f8fe; color: #42638f; }
.guide summary { display: flex; align-items: center; gap: 9px; padding: 12px; font-size: 11px; cursor: pointer; list-style: none; }
.guide summary::-webkit-details-marker { display: none; }
.guide summary > .icon { width: 18px; height: 18px; }
.guide summary .guide-chevron { margin-left: auto; width: 13px; height: 13px; }
.guide[open] .guide-chevron { transform: rotate(90deg); }
.guide-content { padding: 0 14px 10px; font-size: 11px; line-height: 1.8; }
.guide-content p { margin: 0 0 8px; }
code { color: #2b538c; overflow-wrap: anywhere; }
.workspace-note { margin-top: 14px; padding: 12px 16px; }
.redeem-body { flex: 1; }
.redeem-body > .field-label, #redeem-token-wrap { margin-top: 24px; }
.field-hint { margin: 8px 0 0; font-size: 11px; line-height: 1.7; }
.privacy-note { display: flex; align-items: flex-start; gap: 10px; margin-top: 26px; color: #76889d; font-size: 11px; line-height: 1.7; }
.privacy-note .icon { width: 17px; height: 17px; margin-top: 2px; color: #7e9d9a; }
.privacy-note p { margin: 0; }

.admin-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.admin-toolbar h2 { margin: 0; font-size: 18px; }
.admin-toolbar p { margin: 6px 0 0; font-size: 12px; line-height: 1.7; }
.admin-layout { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 20px; }
.admin-stack { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.list-card .card-heading, .form-card .card-heading { min-height: 66px; justify-content: space-between; }
.small-label { font-size: 10px; }
.members-list, .tiers-list { display: grid; gap: 8px; padding: 18px; max-height: 420px; overflow-y: auto; }
.members-list.empty-state, .tiers-list.empty-state { min-height: 130px; }
.member-row { display: flex; flex-direction: column; align-items: stretch; gap: 8px; min-width: 0; width: 100%; border: 1px solid #e0e7f0; border-radius: 7px; padding: 12px; background: #fafcff; color: var(--text); text-align: left; }
.member-row:hover { border-color: #8daedc; background: #f2f7ff; }
.member-email { font-size: 12px; font-weight: 550; overflow-wrap: anywhere; }
.member-details { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.member-tier { font-size: 10px; color: #6d809a; }
.member-form { padding: 22px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 20px; }
.form-footer { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 14px; margin-top: 22px; padding-top: 18px; border-top: 1px solid #e5ebf2; }
.form-footer .field-hint { margin: 0; }
.site-footer { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 24px 0; color: #8a99ad; font-size: 10px; line-height: 1.7; }
.footer-divider { padding: 0 8px; color: #bdc8d5; }

body.sidebar-collapsed { --sidebar-width: 84px; }
.sidebar-collapsed .sidebar { padding-left: 12px; padding-right: 12px; }
.sidebar-collapsed .brand-row { flex-direction: column; margin-bottom: 22px; }
.sidebar-collapsed .brand-copy, .sidebar-collapsed .sidebar-heading, .sidebar-collapsed .nav-label, .sidebar-collapsed .nav-chevron, .sidebar-collapsed .quota-section, .sidebar-collapsed .account-copy, .sidebar-collapsed .account-status { display: none; }
.sidebar-collapsed .tool-tab { justify-content: center; padding: 12px; }
.sidebar-collapsed .account-card { padding-left: 0; padding-right: 0; margin-left: 0; margin-right: 0; }
.sidebar-collapsed .account-main { justify-content: center; }
/* ponytail: the sidebar preference lasts for this page; persist it only if requested. */
@media (min-width: 1800px) { .main-content { padding-top: 40px; } }
@media (max-width: 1200px) { :root { --sidebar-width: 222px; } .sidebar { padding-left: 14px; padding-right: 14px; } .main-content { padding: 28px 26px 0; } .brand-copy strong { font-size: 15px; } .brand-mark { width: 40px; height: 42px; } .card-heading { margin: 0 18px; gap: 9px; } .card-heading h2 { font-size: 14px; } .card-icon { width: 34px; height: 34px; border-radius: 10px; } .card-body { padding: 20px 18px; } .action-footer { margin: 0 18px; } .result-content { margin: 18px; padding: 12px; } .tool-workspace { gap: 16px; } .text-button { font-size: 10px; } }
@media (max-width: 1000px) { .tool-workspace, .tool-workspace.balanced { grid-template-columns: 1fr; } .input-card, .result-card { min-height: 500px; } .input-card { min-height: 570px; } .result-card { min-height: 420px; } .redeem-body { min-height: 400px; } .admin-layout { grid-template-columns: 1fr; } .header-actions { gap: 8px; } .connection-state { font-size: 10px; } .page-header { align-items: flex-start; } }
@media (max-width: 720px) {
  :root, body.sidebar-collapsed { --sidebar-width: 0px; }
  .sidebar, .sidebar-collapsed .sidebar { position: relative; width: 100%; padding: 16px 18px 12px; border-right: 0; border-bottom: 1px solid #d4e1e5; overflow: visible; }
  .brand-row, .sidebar-collapsed .brand-row { flex-direction: row; margin: 0 0 16px; }
  .brand-copy, .sidebar-collapsed .brand-copy { display: block; }
  .brand-mark { width: 36px; height: 38px; border-radius: 10px; font-size: 13px; }
  .brand-mark span { bottom: 6px; width: 11px; right: 8px; }
  .sidebar-toggle, .sidebar-heading { display: none !important; }
  .quota-section, .sidebar-collapsed .quota-section { display: block; margin: 8px 0 12px; }
  .section-heading, .quota-help, .quota-caption { display: none; }
  .quota-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 0; }
  .quota-card { gap: 5px; grid-template-columns: 1fr; }
  .quota-label, .quota-numbers { font-size: 10px; }
  .tool-nav { flex-direction: row; gap: 6px; overflow-x: auto; padding: 3px 2px 7px; }
  .tool-tab, .sidebar-collapsed .tool-tab { justify-content: center; width: auto; flex: 1 0 auto; min-height: 44px; padding: 11px 13px; gap: 8px; font-size: 12px; }
  .nav-label, .sidebar-collapsed .nav-label { display: inline; }
  .nav-chevron { display: none; }
  .tool-tab > .icon { width: 17px; height: 17px; }
  .admin-tab { margin: 0; }
  .account-card, .sidebar-collapsed .account-card { margin: 0; padding: 10px 0 0; border-top: 1px solid #cbdcde; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
  .account-copy, .sidebar-collapsed .account-copy { display: block; }
  .account-main, .sidebar-collapsed .account-main { justify-content: flex-start; }
  .account-copy h2 { font-size: 11px; }
  .account-copy p { font-size: 9px; }
  .account-status, .sidebar-collapsed .account-status { display: flex; margin: 0; }
  .account-status .button { width: auto; }
  .avatar { width: 30px; height: 30px; border-width: 2px; font-size: 11px; }
  .main-content { margin-left: 0; padding: 24px 18px 0; }
  .page-header { gap: 12px; margin-bottom: 22px; }
  h1 { font-size: 26px; }
  .eyebrow { font-size: 9px; letter-spacing: 1px; }
  .page-description { font-size: 12px; }
  .header-actions { flex-direction: column-reverse; align-items: flex-end; gap: 8px; padding-top: 3px; }
  .connection-state { white-space: nowrap; font-size: 9px; }
  .connection-state::before { width: 5px; height: 5px; }
  .input-card { min-height: 530px; }
  .result-card { min-height: 390px; }
  .card-heading { min-height: 82px; }
  .card-heading h2 { font-size: 14px; }
  .card-heading p { font-size: 10px; }
  .card-heading .text-button { white-space: normal; max-width: 65px; line-height: 1.7; }
  .large-input { min-height: 250px; }
  .result-content { min-height: 270px; }
  .admin-toolbar { align-items: flex-start; flex-direction: column; }
  .site-footer { flex-direction: column; align-items: flex-start; gap: 3px; padding: 22px 0; }
}
@media (max-width: 390px) { .main-content { padding-left: 12px; padding-right: 12px; } .sidebar { padding-left: 12px; padding-right: 12px; } .header-actions .connection-state { max-width: 77px; white-space: normal; text-align: right; } .action-footer { gap: 10px; } .button { padding-left: 12px; padding-right: 12px; font-size: 11px; } .form-grid { grid-template-columns: 1fr; } .card-heading { gap: 8px; } .card-heading .card-icon { width: 30px; height: 30px; } .card-heading h2 { font-size: 13px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }