:root { --ink:#172033; --muted:#778191; --line:#e3e8ee; --canvas:#f5f7f9; --surface:#fff; --teal:#0f766e; --blue:#2563eb; --green:#059669; --red:#dc2626; --amber:#b45309; }
* { box-sizing:border-box; } body { min-width:320px; margin:0; background:var(--canvas); color:var(--ink); font-family:Inter,"Microsoft YaHei",Arial,sans-serif; } [v-cloak] { display:none; } button,input { font:inherit; }.app-shell { min-height:100vh; display:grid; grid-template-columns:224px minmax(0,1fr); }.sidebar { position:fixed; inset:0 auto 0 0; z-index:2; display:flex; flex-direction:column; width:224px; padding:24px 14px 18px; background:#172033; color:#c8d0da; }.brand { display:flex; align-items:center; gap:10px; padding:0 10px; color:#fff; text-decoration:none; }.brand-mark { display:grid; place-items:center; width:31px; height:31px; border-radius:6px; background:#14b8a6; color:#0b302f; font-size:11px; font-weight:800; }.brand strong,.brand small { display:block; }.brand strong { font-size:15px; letter-spacing:0; }.brand small { margin-top:1px; color:#8fa0b3; font-size:10px; }.side-nav { display:grid; gap:5px; margin-top:44px; }.nav-item { display:flex; align-items:center; gap:11px; min-height:40px; padding:0 11px; border-radius:5px; color:#aebbc9; font-size:13px; text-decoration:none; }.nav-item svg { width:17px; height:17px; }.nav-item:hover,.nav-item.active { color:#fff; background:#263246; }.nav-item.active { box-shadow:inset 2px 0 0 #2dd4bf; }.sidebar-footer { display:flex; align-items:center; gap:8px; margin-top:auto; padding:10px; color:#8fa0b3; font-size:11px; }.status-dot { width:7px; height:7px; border-radius:50%; background:#34d399; }.workspace { width:min(1440px,100%); margin:0 auto; padding:42px clamp(22px,4vw,64px) 56px; }.topbar { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; }.eyebrow { margin:0 0 9px; color:#0f766e; font-size:11px; font-weight:700; letter-spacing:1px; }.topbar h1 { margin:0; font-size:30px; line-height:1.2; letter-spacing:0; }.subtitle { margin:8px 0 0; color:var(--muted); font-size:14px; }.icon-button { display:grid; place-items:center; flex:0 0 auto; width:38px; height:38px; border:1px solid var(--line); border-radius:5px; color:#475467; background:var(--surface); cursor:pointer; }.icon-button:hover:not(:disabled) { color:var(--teal); border-color:#8ed5cd; }.icon-button svg { width:18px; }.spinning { animation:spin .9s linear infinite; } @keyframes spin { to { transform:rotate(360deg); } }
.filter-bar { display:grid; grid-template-columns:minmax(220px,1.2fr) minmax(245px,1fr) minmax(185px,.8fr) auto; align-items:end; gap:13px; margin-top:34px; padding:16px; border:1px solid var(--line); border-radius:7px; background:var(--surface); }.filter-field { min-width:0; }.filter-field label { display:block; margin-bottom:7px; color:#475467; font-size:12px; font-weight:600; }.filter-bar .el-input,.filter-bar .el-date-editor { width:100%; }.filter-bar .el-input__wrapper,.filter-bar .el-range-editor.el-input__wrapper { min-height:36px; box-shadow:0 0 0 1px #d7dee6 inset; }.filter-bar .el-input__wrapper:hover,.filter-bar .el-range-editor.el-input__wrapper:hover { box-shadow:0 0 0 1px #8ccfc7 inset; }.filter-bar .el-input__prefix svg { width:15px; color:#7d8998; }.primary-action { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:36px; padding:0 15px; border:1px solid var(--teal); border-radius:5px; color:#fff; background:var(--teal); font-size:13px; font-weight:600; cursor:pointer; white-space:nowrap; }.primary-action:hover:not(:disabled) { background:#0b5f59; }.primary-action:disabled,.icon-button:disabled { opacity:.6; cursor:wait; }.primary-action svg { width:16px; }.error-banner { display:flex; align-items:center; gap:8px; margin-top:16px; padding:12px 14px; border:1px solid #fecaca; border-radius:6px; color:#b42318; background:#fff5f5; font-size:13px; }.error-banner svg { width:17px; }.dashboard-content { margin-top:22px; }.summary-line { display:flex; justify-content:space-between; gap:12px; margin:0 2px 12px; color:var(--muted); font-size:12px; }.kpi-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border:1px solid var(--line); border-radius:7px; background:var(--surface); overflow:hidden; }.kpi { min-height:142px; display:flex; flex-direction:column; padding:22px; border-left:1px solid var(--line); }.kpi:first-child { border-left:0; }.kpi-accent { background:#f0fdfa; }.kpi-label { color:#667085; font-size:13px; }.kpi strong { margin:12px 0 auto; color:#1b2738; font-size:29px; font-weight:700; line-height:1; letter-spacing:0; }.kpi-accent strong { color:#0f766e; }.kpi strong small { margin-left:2px; font-size:14px; }.kpi-meta { color:#778191; font-size:12px; }.success-text { color:#047857!important; }.danger-text { color:#b42318!important; }.pending-text { color:#a16207!important; }.chart-grid { display:grid; grid-template-columns:minmax(0,1.75fr) minmax(300px,1fr); gap:16px; margin-top:16px; }.panel { background:var(--surface); border:1px solid var(--line); border-radius:7px; }.chart-panel { min-height:332px; padding:20px 20px 12px; }.panel-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:15px; }.panel-heading h2 { margin:0; font-size:15px; }.panel-heading p { margin:5px 0 0; color:var(--muted); font-size:12px; }.legend { display:flex; align-items:center; gap:6px; color:#687486; font-size:11px; white-space:nowrap; }.legend-dot { width:7px; height:7px; margin-left:4px; border-radius:50%; }.legend-dot.total { background:var(--blue); }.legend-dot.success { background:var(--green); }.legend-dot.failed { background:var(--red); }.chart { width:100%; height:248px; margin-top:16px; }.action-panel { margin-top:16px; }.action-heading { padding:20px 20px 15px; }.result-count { padding:4px 7px; border-radius:4px; color:#0f766e; background:#ecfdf5; font-size:11px; }.action-table-wrap { overflow-x:auto; border-top:1px solid var(--line); }.action-table { width:100%; min-width:750px; border-collapse:collapse; text-align:left; }.action-table th { padding:11px 20px; color:#778191; background:#fafbfc; font-size:11px; font-weight:600; white-space:nowrap; }.action-table td { padding:13px 20px; border-top:1px solid #eef1f4; color:#344054; font-size:13px; white-space:nowrap; }.action-table tbody tr:hover { background:#fbfdfd; }.action-name { display:grid; gap:3px; min-width:190px; }.action-name b { color:#1d2939; font-size:13px; }.action-name span,.action-name small { color:#778191; font-size:11px; }.action-name small { color:#0f766e; }.rate { display:inline-block; min-width:58px; padding:3px 6px; border-radius:4px; font-size:11px; text-align:center; }.rate-good { color:#047857; background:#ecfdf5; }.rate-warning { color:#a16207; background:#fffbeb; }.rate-danger { color:#b42318; background:#fff1f1; }.empty-cell { padding:34px!important; color:#98a2b3!important; text-align:center; }.empty-state { max-width:540px; margin:13vh auto; text-align:center; }.empty-icon { display:grid; place-items:center; width:48px; height:48px; margin:0 auto 16px; border-radius:7px; color:#0f766e; background:#e9f8f5; }.empty-icon svg { width:24px; }.empty-state h2 { margin:0; font-size:18px; }.empty-state p { margin:8px auto 0; color:var(--muted); font-size:13px; line-height:1.7; }
@media (max-width:1000px) { .app-shell { grid-template-columns:1fr; }.sidebar { position:static; display:flex; flex-direction:row; align-items:center; width:100%; min-height:58px; padding:10px 18px; }.side-nav { display:flex; gap:4px; margin:0 0 0 auto; }.nav-item { min-height:34px; padding:0 8px; }.nav-item span,.sidebar-footer { display:none; }.workspace { padding-top:28px; }.filter-bar { grid-template-columns:1fr 1fr; }.primary-action { min-height:36px; }.chart-grid { grid-template-columns:1fr; }.type-panel { min-height:285px; }.type-panel .chart { height:200px; } }
@media (max-width:640px) { .sidebar { padding:10px 14px; }.workspace { padding:24px 14px 36px; }.topbar h1 { font-size:24px; }.subtitle { font-size:13px; }.filter-bar { grid-template-columns:1fr; margin-top:24px; padding:14px; }.primary-action { width:100%; }.summary-line { display:grid; gap:4px; }.kpi-grid { grid-template-columns:1fr 1fr; }.kpi { min-height:122px; padding:17px; border-top:1px solid var(--line); }.kpi:nth-child(odd) { border-left:0; }.kpi:nth-child(-n+2) { border-top:0; }.kpi strong { font-size:24px; }.chart-panel { min-height:300px; padding:17px 12px 10px; }.chart { height:220px; }.legend { display:none; }.action-heading { padding:17px 15px 13px; }.action-table th,.action-table td { padding-left:15px; padding-right:15px; } }

.legend-dot.credits { background:#b45309; }
.notification-config-grid { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(300px,.8fr); gap:16px; margin-top:34px; }
.alert-config-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:34px; }.alert-panel { min-width:0; }.alert-list { border-top:1px solid var(--line); }.alert-card { padding:16px 20px; border-top:1px solid #eef1f4; }.alert-card:first-child { border-top:0; }.alert-card-title { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }.alert-card-title strong { color:#1d2939; font-size:13px; }.small-icon { width:28px; height:28px; }.small-icon svg { width:14px; }.alert-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }.alert-fields label { display:block; color:#667085; font-size:11px; }.alert-fields label:first-child,.alert-fields label:nth-child(2) { grid-column:span 2; }.alert-fields input { width:100%; min-height:34px; margin-top:5px; padding:0 9px; border:1px solid #d7dee6; border-radius:4px; outline:0; color:#344054; font:inherit; font-size:12px; }.alert-fields input:focus { border-color:#8ccfc7; box-shadow:0 0 0 2px rgba(15,118,110,.08); }.alert-fields small { margin-left:5px; color:#98a2b3; }.alert-toggle { display:flex; align-items:center; justify-content:space-between; margin-top:12px; color:#667085; font-size:11px; }.alert-empty { padding:36px 20px; color:#98a2b3; font-size:12px; text-align:center; }.alert-save-row { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-top:12px; color:#778191; font-size:11px; }.alert-save-row .primary-action { min-width:150px; }.alert-save-row .primary-action svg { width:15px; }
.notification-config-panel { min-width:0; }.notification-heading { padding:20px 20px 15px; }.notification-rule-list { border-top:1px solid var(--line); }
.notification-rule { display:flex; align-items:center; gap:13px; padding:17px 20px; border-top:1px solid #eef1f4; }.notification-rule:first-child { border-top:0; }.rule-icon { display:grid; place-items:center; flex:0 0 auto; width:34px; height:34px; border-radius:6px; }.rule-icon svg { width:17px; }.rule-danger { color:#b42318; background:#fff1f1; }.rule-teal { color:#0f766e; background:#ecfdf5; }.rule-amber { color:#a16207; background:#fffbeb; }
.rule-content { min-width:0; flex:1; }.rule-title { display:flex; align-items:center; gap:8px; }.rule-title strong { color:#1d2939; font-size:13px; }.rule-status { padding:2px 5px; border-radius:3px; color:#98a2b3; background:#f2f4f7; font-size:10px; }.rule-status.enabled { color:#047857; background:#ecfdf5; }.rule-content p { margin:5px 0; overflow:hidden; color:#667085; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }.rule-content small { color:#98a2b3; font-size:11px; }
.switch-button { position:relative; flex:0 0 auto; width:34px; height:20px; padding:2px; border:0; border-radius:10px; background:#d0d5dd; cursor:pointer; }.switch-button span { display:block; width:16px; height:16px; border-radius:50%; background:#fff; box-shadow:0 1px 2px rgba(16,24,40,.2); transition:transform .18s ease; }.switch-button.on { background:#0f766e; }.switch-button.on span { transform:translateX(14px); }
.delivery-panel { padding-bottom:20px; }.config-status { display:inline-flex; align-items:center; gap:5px; padding:4px 7px; border-radius:4px; color:#a16207; background:#fffbeb; font-size:11px; }.config-status.configured { color:#047857; background:#ecfdf5; }.config-status i { width:6px; height:6px; border-radius:50%; background:#d97706; }.config-status.configured i { background:#059669; }.config-field { margin:0 20px 14px; }.config-field label { display:block; margin-bottom:7px; color:#475467; font-size:12px; font-weight:600; }.config-field input,.config-field select { width:100%; min-height:36px; padding:0 10px; border:1px solid #d7dee6; border-radius:5px; outline:0; color:#344054; background:#fff; font:inherit; font-size:12px; }.config-field input:focus,.config-field select:focus { border-color:#8ccfc7; box-shadow:0 0 0 2px rgba(15,118,110,.08); }.cron-preview { display:grid; gap:5px; margin:18px 20px; padding:13px; border-radius:5px; color:#475467; background:#f8fafc; }.cron-preview span { display:flex; align-items:center; gap:6px; font-size:11px; }.cron-preview svg { width:15px; color:#0f766e; }.cron-preview strong { color:#1d2939; font-size:13px; }.cron-preview small { color:#98a2b3; font-size:10px; line-height:1.5; }.config-actions { display:flex; gap:8px; margin:0 20px; }.config-actions button { flex:1; }.config-save { margin:0; }.config-save svg,.secondary-action svg { width:15px; }.secondary-action { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:36px; padding:0 12px; border:1px solid #d0d5dd; border-radius:5px; color:#475467; background:#fff; font-size:12px; cursor:pointer; }.secondary-action:hover:not(:disabled) { color:#0f766e; border-color:#8ccfc7; }.secondary-action:disabled { opacity:.6; cursor:wait; }
.cron-panel { margin-top:16px; }.cron-table-wrap { overflow-x:auto; border-top:1px solid var(--line); }.cron-table { width:100%; min-width:720px; border-collapse:collapse; text-align:left; }.cron-table th { padding:11px 20px; color:#778191; background:#fafbfc; font-size:11px; font-weight:600; white-space:nowrap; }.cron-table td { padding:13px 20px; border-top:1px solid #eef1f4; color:#667085; font-size:12px; white-space:nowrap; }.cron-table td strong { color:#1d2939; font-size:12px; }.cron-table code { padding:3px 5px; border-radius:3px; color:#0f766e; background:#ecfdf5; font:11px ui-monospace,SFMono-Regular,Consolas,monospace; }.job-status { padding:3px 6px; border-radius:4px; font-size:10px; }.job-status.waiting { color:#a16207; background:#fffbeb; }
.template-panel { margin-top:16px; }.template-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; padding:0 20px 20px; }.template-card { padding:14px; border:1px solid var(--line); border-radius:6px; background:#fafbfc; }.template-card-heading { display:flex; align-items:center; justify-content:space-between; margin-bottom:13px; }.template-card-heading strong { color:#1d2939; font-size:12px; }.template-card label { display:block; margin:10px 0 6px; color:#667085; font-size:11px; }.template-card input,.template-card textarea { width:100%; padding:8px 9px; border:1px solid #d7dee6; border-radius:4px; outline:0; color:#344054; background:#fff; font:inherit; font-size:12px; resize:vertical; }.template-card input:focus,.template-card textarea:focus { border-color:#8ccfc7; box-shadow:0 0 0 2px rgba(15,118,110,.08); }
.notification-toolbar { display:flex; align-items:center; gap:16px; margin-top:34px; padding:12px 14px; border:1px solid var(--line); border-radius:7px; background:var(--surface); }
.notification-search { display:flex; align-items:center; gap:8px; width:min(330px,100%); min-height:36px; padding:0 10px; border:1px solid #d7dee6; border-radius:5px; color:#7d8998; }
.notification-search:focus-within { border-color:#8ccfc7; box-shadow:0 0 0 2px rgba(15,118,110,.08); }
.notification-search svg { width:16px; flex:0 0 auto; }
.notification-search input { width:100%; min-width:0; border:0; outline:0; color:var(--ink); background:transparent; font-size:12px; }
.notification-tabs { display:flex; align-items:center; gap:3px; }
.notification-tabs button { display:inline-flex; align-items:center; gap:6px; min-height:30px; padding:0 10px; border:0; border-radius:4px; color:#667085; background:transparent; font-size:12px; cursor:pointer; }
.notification-tabs button:hover,.notification-tabs button.selected { color:#0f766e; background:#ecfdf5; }
.notification-tabs button span { min-width:17px; padding:1px 4px; border-radius:8px; color:#8a95a3; background:#f0f2f4; font-size:10px; }
.notification-tabs button.selected span { color:#0f766e; background:#d1fae5; }
.text-action { display:inline-flex; align-items:center; gap:6px; margin-left:auto; padding:0; border:0; color:#0f766e; background:transparent; font-size:12px; cursor:pointer; white-space:nowrap; }
.text-action:disabled { color:#98a2b3; cursor:default; }.text-action svg { width:15px; }
.notification-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:16px; }
.notification-stat { display:flex; align-items:center; gap:12px; min-height:82px; padding:15px 17px; border:1px solid var(--line); border-radius:7px; background:var(--surface); }
.stat-icon { display:grid; place-items:center; width:34px; height:34px; border-radius:6px; }.stat-icon svg { width:17px; }.stat-icon.unread { color:#b42318; background:#fff1f1; }.stat-icon.pending { color:#a16207; background:#fffbeb; }.stat-icon.failed { color:#b42318; background:#fff1f1; }.stat-icon.success { color:#047857; background:#ecfdf5; }
.notification-stat small { display:block; color:#778191; font-size:11px; }.notification-stat strong { display:block; margin-top:4px; color:#1d2939; font-size:22px; line-height:1; }
.notification-layout { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(270px,.75fr); gap:16px; margin-top:16px; }
.notification-panel,.notification-detail-panel { min-width:0; }.notification-heading { padding:20px 20px 15px; }.notification-list { border-top:1px solid var(--line); }
.notification-item { display:grid; grid-template-columns:30px minmax(0,1fr) 16px; gap:12px; width:100%; padding:16px 20px; border:0; border-top:1px solid #eef1f4; color:inherit; background:var(--surface); text-align:left; cursor:pointer; }.notification-item:first-child { border-top:0; }.notification-item:hover { background:#fbfdfd; }.notification-item.unread { background:#f8fffd; }.notification-status-icon { display:grid; place-items:center; width:29px; height:29px; margin-top:1px; border-radius:50%; }.notification-status-icon svg { width:16px; }.notification-failed .notification-status-icon { color:#b42318; background:#fff1f1; }.notification-pending .notification-status-icon { color:#a16207; background:#fffbeb; }.notification-succeeded .notification-status-icon { color:#047857; background:#ecfdf5; }
.notification-body { display:grid; gap:5px; min-width:0; }.notification-title { display:flex; align-items:center; gap:7px; min-width:0; }.notification-title b { overflow:hidden; color:#1d2939; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }.notification-title em { padding:2px 5px; border-radius:3px; color:#0f766e; background:#d1fae5; font-size:10px; font-style:normal; font-weight:600; }.notification-copy { overflow:hidden; color:#667085; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }.notification-meta { display:flex; flex-wrap:wrap; gap:10px; color:#98a2b3; font-size:11px; }.notification-meta time { margin-left:auto; }.notification-arrow { width:15px; margin-top:8px; color:#98a2b3; }
.notification-empty { padding:66px 20px; color:#98a2b3; text-align:center; }.notification-empty svg { width:25px; }.notification-empty h3 { margin:10px 0 0; color:#475467; font-size:14px; }.notification-empty p { margin:6px 0 0; font-size:12px; }
.notification-detail-panel { padding-bottom:20px; }.notice-tip { display:flex; gap:10px; margin:0 20px 12px; padding:13px; border-radius:5px; }.notice-tip svg { width:17px; flex:0 0 auto; }.notice-tip strong { display:block; font-size:12px; }.notice-tip p { margin:5px 0 0; color:#667085; font-size:11px; line-height:1.6; }.warning-tip { color:#a16207; background:#fffbeb; }.pending-tip { color:#0f766e; background:#ecfdf5; }.notification-legend { display:flex; gap:14px; margin:20px 20px 0; padding-top:16px; border-top:1px solid var(--line); color:#667085; font-size:11px; }.notification-legend span { display:inline-flex; align-items:center; gap:5px; }.notification-legend .legend-dot { display:inline-block; width:7px; height:7px; margin:0; }.legend-dot.pending { background:#d97706; }
@media (max-width:1000px) { .notification-config-grid { grid-template-columns:1fr; }.template-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:1000px) { .alert-config-grid { grid-template-columns:1fr; } }
@media (max-width:640px) { .notification-heading { padding:17px 15px 13px; }.notification-rule { padding:14px 15px; }.notification-rule .rule-content p { white-space:normal; line-height:1.5; }.config-field,.cron-preview { margin-left:15px; margin-right:15px; }.config-actions { margin:0 15px; flex-direction:column; }.config-save { width:100%; }.template-grid { grid-template-columns:1fr; padding:0 15px 15px; }.alert-card { padding:14px 15px; }.alert-fields { grid-template-columns:1fr; }.alert-fields label:first-child,.alert-fields label:nth-child(2) { grid-column:auto; }.alert-save-row { align-items:stretch; flex-direction:column; }.alert-save-row .primary-action { width:100%; } }
.field-label-help { display:inline-flex; align-items:center; gap:4px; }.field-help { display:inline-grid; place-items:center; width:16px; height:16px; margin:0; padding:0; border:1px solid #8ccfc7; border-radius:50%; color:#0f766e; background:#ecfdf5; font-size:11px; font-family:Arial,sans-serif; font-weight:700; line-height:1; cursor:help; }.field-help:focus-visible { outline:2px solid rgba(15,118,110,.35); outline-offset:2px; }
.alert-card-actions { display:flex; align-items:center; gap:7px; }.quick-send { min-height:28px; padding:0 8px; font-size:11px; }.quick-send svg { width:13px; }
.multi-email-field { position:relative; }.multi-email-field input { padding-right:30px; }.multi-email-field svg { position:absolute; top:9px; right:9px; width:15px; color:#98a2b3; pointer-events:none; }.field-hint { display:block; margin:5px 0 0!important; color:#98a2b3; font-size:10px!important; }
.daily-credit-panel { margin-top:16px; }
.daily-credit-heading { padding:20px 20px 15px; }
.daily-credit-table-wrap { overflow-x:auto; border-top:1px solid var(--line); }
.daily-credit-table { width:100%; border-collapse:collapse; text-align:left; }
.daily-credit-table th { padding:11px 20px; color:#778191; background:#fafbfc; font-size:11px; font-weight:600; }
.daily-credit-table td { padding:12px 20px; border-top:1px solid #eef1f4; color:#344054; font-size:13px; }
.daily-credit-table tbody tr:hover { background:#fbfdfd; }
.credits-value { color:#a16207!important; font-weight:700; }
.job-status.success { color:#047857; background:#ecfdf5; }.job-status.error { color:#b42318; background:#fff1f1; }
@media (max-width:640px) { .daily-credit-heading { padding:17px 15px 13px; }.daily-credit-table th,.daily-credit-table td { padding-left:15px; padding-right:15px; } }

/* The sidebar is fixed visually, so keep the dashboard in the second grid track. */
@media (min-width:1001px) { .sidebar { grid-column:1; } .workspace { grid-column:2; width:100%; max-width:1440px; } }
@media (max-width:1000px) { .workspace { grid-column:1; } }