@import url('./html-editor.css?v=html-editor-v1');
:root {
    --nav: #0d1730;
    --blue: #225bea;
    --ink: #19253c;
    --muted: #69758d;
    --line: #e4e9f2;
    --bg: #f3f6fb;
    --surface: white;
    --radius: 14px;
    font-family: Inter, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', system-ui, sans-serif;
    color: var(--ink);
    background: var(--bg);
    font-size: 16px
}

* {
    box-sizing: border-box
}

body {
    margin: 0
}

button,
input,
textarea,
select {
    font: inherit
}

button,
a,
input,
select,
textarea {
    outline-offset: 3px
}

button {
    cursor: pointer
}

a {
    color: var(--blue);
    text-decoration: none
}

button {
    border: 1px solid var(--line);
    border-radius: 9px;
    background: white;
    padding: 10px 14px;
    color: var(--ink);
    font-size: .875rem;
    min-height: 42px
}

button:hover {
    background: #edf3ff
}

button.primary {
    background: var(--blue);
    color: white;
    border-color: var(--blue)
}

button.danger {
    color: #c22b41
}

button:disabled {
    opacity: .5;
    cursor: wait
}

input,
select,
textarea {
    width: 100%;
    border: 1px solid #d8dfeb;
    background: white;
    border-radius: 8px;
    padding: 10px 12px;
    min-height: 42px;
    color: var(--ink);
    font-size: .875rem
}

textarea {
    resize: vertical;
    min-height: 94px
}

input[type=checkbox] {
    width: 18px;
    min-height: 18px;
    accent-color: var(--blue)
}

input[type=color] {
    padding: 4px
}

label {
    display: block;
    font-size: .875rem;
    margin: 14px 0 6px;
    line-height: 1.6
}

h1,
h2,
h3,
p {
    margin-top: 0
}

h1 {
    font-size: 1.7rem;
    letter-spacing: -.04em
}

h2 {
    font-size: 1.2rem
}

h3 {
    font-size: 1rem
}

p {
    line-height: 1.7
}

.muted {
    color: var(--muted);
    font-size: .875rem
}

.small {
    font-size: .8125rem
}

.shell {
    display: grid;
    grid-template-columns: 224px minmax(0, 1fr);
    min-height: 100vh
}

.sidebar {
    background: var(--nav);
    color: #a7b5d1;
    padding: 26px 16px;
    position: sticky;
    top: 0;
    height: 100vh;
    display: flex;
    flex-direction: column
}

.brand {
    display: flex;
    gap: 11px;
    align-items: center;
    color: white;
    font-weight: 700;
    letter-spacing: -.03em;
    margin: 0 10px 35px;
    font-size: 1.08rem
}

.brand-mark {
    background: #396fff;
    width: 32px;
    height: 32px;
    border-radius: 9px;
    display: grid;
    place-items: center;
    font-size: 20px
}

.nav-group {
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: #6e819f;
    margin: 20px 14px 10px
}

.nav-item {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #a7b5d1;
    padding: 12px 14px;
    border-radius: 9px;
    margin: 3px 0;
    font-size: .875rem
}

.nav-item:hover {
    background: #182643;
    color: white
}

.nav-item.active {
    background: #244785;
    color: #fff
}

.nav-icon {
    display: inline-flex;
    width: 20px;
    font-size: 17px
}

.sidebar-foot {
    margin-top: auto;
    border-top: 1px solid #263450;
    padding: 18px 10px 0;
    font-size: .8125rem;
    overflow-wrap: anywhere
}

.sidebar-foot button {
    margin-top: 12px;
    color: #c6d3ea;
    background: none;
    border-color: #354260;
    min-height: 34px
}

.workspace {
    min-width: 0
}

.topbar {
    background: #fff;
    height: 74px;
    border-bottom: 1px solid var(--line);
    padding: 0 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px
}

.breadcrumb {
    color: #71809a;
    font-size: .875rem
}

.topbar-right {
    display: flex;
    gap: 12px;
    align-items: center
}

.avatar {
    border-radius: 50%;
    background: #e9effe;
    color: #254eca;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    font-size: .875rem
}

.content {
    padding: 32px;
    max-width: 1600px;
    margin: auto
}

.page-title {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 28px
}

.page-title p {
    margin: 6px 0 0
}

.actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center
}

.card {
    background: white;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 22px
}

.stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin: 20px 0
}

.stat-label {
    font-size: .875rem;
    color: var(--muted)
}

.stat-value {
    font-size: 2rem;
    font-weight: 650;
    letter-spacing: -.04em;
    margin: 14px 0 4px
}

.stat-foot {
    font-size: .8125rem;
    color: #74829b
}

.row {
    display: flex;
    gap: 16px;
    align-items: center
}

.row>* {
    flex: 1;
    min-width: 0
}

.grid2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px
}

.grid3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px
}

.table-wrap {
    overflow: auto;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: white
}

table {
    border-collapse: collapse;
    width: 100%;
    text-align: left;
    white-space: nowrap;
    font-size: .875rem
}

th {
    background: #f8faff;
    color: #71809a;
    font-weight: 500
}

td,
th {
    padding: 16px;
    border-bottom: 1px solid var(--line)
}

tbody tr:last-child td {
    border: 0
}

td.title-cell {
    white-space: normal;
    min-width: 220px
}

td .actions {
    flex-wrap: nowrap
}

td .actions button {
    padding: 7px 10px;
    min-height: 34px
}

.badge {
    display: inline-flex;
    align-items: center;
    border-radius: 6px;
    background: #eff2f8;
    color: #67748a;
    padding: 5px 8px;
    font-size: .75rem
}

.badge.published,
.badge.paid,
.badge.done,
.badge.won {
    background: #e6f6ee;
    color: #167446
}

.badge.offline,
.badge.failed,
.badge.invalid {
    background: #fff0f0;
    color: #b74b59
}

.badge.pending,
.badge.queued,
.badge.running {
    background: #fff4dc;
    color: #9a660f
}

.empty {
    text-align: center;
    padding: 64px 24px;
    color: var(--muted)
}

.empty strong {
    display: block;
    color: var(--ink);
    font-size: 1.1rem;
    margin-bottom: 10px
}

.toolbar {
    display: flex;
    gap: 10px;
    margin: 20px 0;
    align-items: center;
    flex-wrap: wrap
}

.toolbar input {
    max-width: 300px
}

.toolbar select {
    width: auto;
    min-width: 130px
}

.chart {
    height: 180px;
    display: flex;
    gap: 6px;
    align-items: flex-end;
    margin-top: 18px;
    padding-top: 10px
}

.chart-bar {
    flex: 1;
    background: #477cfa;
    border-radius: 5px 5px 0 0;
    min-height: 3px;
    position: relative
}

.chart-bar:hover {
    background: #225bea
}

.section-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 18px
}

.section-top h2 {
    margin: 0
}

.page-card {
    display: flex;
    flex-direction: column;
    gap: 12px
}

.page-card .cover {
    height: 112px;
    background: linear-gradient(135deg, #e8efff, #f4f7ff);
    border-radius: 9px;
    display: flex;
    align-items: center;
    padding: 22px;
    font-weight: 650;
    color: #314b7d;
    font-size: 1.2rem;
    overflow: hidden
}

.page-card .actions {
    margin-top: auto
}

.login {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 1fr 1fr
}

.login-intro {
    background: var(--nav);
    color: white;
    padding: 9vw 7vw;
    display: flex;
    flex-direction: column;
    justify-content: center
}

.login-intro h1 {
    font-size: 3rem;
    line-height: 1.2;
    max-width: 500px
}

.login-intro p {
    color: #91a7ca;
    max-width: 400px
}

.login-panel {
    padding: 40px;
    display: flex;
    justify-content: center;
    align-items: center
}

.login-panel form {
    max-width: 380px;
    width: 100%
}

.login-panel .primary {
    width: 100%;
    margin-top: 24px
}

.loading {
    padding: 60px;
    color: var(--muted)
}

#toast {
    position: fixed;
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
    background: #132544;
    color: white;
    border-radius: 10px;
    padding: 13px 20px;
    z-index: 1000;
    display: none;
    max-width: calc(100vw - 32px);
    box-shadow: 0 8px 28px #14223d30
}

#toast.visible {
    display: block
}

dialog {
    border: 0;
    border-radius: 16px;
    padding: 0;
    max-width: min(850px, calc(100vw - 32px));
    width: 720px;
    max-height: 90vh;
    color: var(--ink);
    box-shadow: 0 30px 80px #00102b44
}

dialog::backdrop {
    background: #0b183a77
}

dialog .dialog-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 22px 26px;
    border-bottom: 1px solid var(--line);
    position: sticky;
    top: 0;
    background: white;
    z-index: 2
}

dialog .dialog-head h2 {
    margin: 0
}

dialog .dialog-body {
    padding: 8px 26px 26px;
    overflow: auto
}

dialog .dialog-foot {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    border-top: 1px solid var(--line);
    padding: 18px 26px;
    background: #fafbff;
    position: sticky;
    bottom: 0
}

pre {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    background: #f4f7fb;
    padding: 14px;
    border-radius: 10px;
    font-size: .8125rem
}

.notice {
    border: 1px solid #cddbfb;
    background: #eef4ff;
    color: #325186;
    border-radius: 10px;
    padding: 13px 16px;
    font-size: .875rem;
    line-height: 1.65;
    margin: 16px 0
}

.asset-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 14px
}

.asset-item {
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 10px;
    overflow: hidden
}

.asset-item img {
    width: 100%;
    height: 105px;
    object-fit: cover;
    border-radius: 6px
}

.asset-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .8125rem;
    margin: 8px 0
}

.checkline {
    display: flex;
    gap: 10px;
    align-items: center
}

.variant-row {
    background: #f4f7fb;
    padding: 12px;
    border-radius: 9px;
    margin-top: 10px
}

.setting-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 20px
}

.setting-tabs button.active {
    background: #e5edff;
    color: #225bea;
    border-color: #a9c3ff
}

.settings-form {
    max-width: 820px
}

.pagination {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px
}

.timeline {
    border-left: 2px solid #dbe5fb;
    padding-left: 20px;
    margin: 20px 8px
}

.timeline p {
    position: relative
}

.timeline p:before {
    content: '';
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #4b7eef;
    left: -25px;
    top: 9px
}

.editor-content {
    padding: 0
}

.editor-top {
    background: white;
    border-bottom: 1px solid var(--line);
    padding: 14px 20px;
    display: flex;
    gap: 14px;
    align-items: center;
    justify-content: space-between
}

.editor-top h2 {
    margin: 0;
    font-size: 1rem
}

.editor-top select {
    width: 130px
}

.editor {
    display: grid;
    grid-template-columns: 220px minmax(300px, 1fr) 300px;
    min-height: calc(100vh - 150px)
}

.editor-left,
.editor-right {
    background: white;
    padding: 18px;
    overflow: auto;
    max-height: calc(100vh - 150px)
}

.editor-left {
    border-right: 1px solid var(--line)
}

.editor-right {
    border-left: 1px solid var(--line)
}

.editor-right label {
    font-size: .8125rem
}

.editor-canvas {
    padding: 18px;
    overflow: auto;
    background: #eaf0f8;
    display: flex;
    align-items: flex-start;
    flex-direction: column
}

.device-switch {
    display: flex;
    justify-content: center;
    gap: 8px;
    width: 100%;
    margin-bottom: 16px
}

.device-switch button {
    min-height: 34px;
    padding: 6px 12px
}

.device-switch .active {
    background: #18386c;
    color: white
}

.preview-frame {
    margin: 0 auto;
    background: white;
    box-shadow: 0 8px 35px #20365b18;
    flex-shrink: 0;
    border: 1px solid #cbd5e6;
    border-radius: 16px;
    width: 390px;
    max-width: none;
    height: 740px;
    display: block
}

.block-list {
    display: flex;
    flex-direction: column;
    gap: 6px
}

.block-row {
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    cursor: pointer;
    font-size: .8125rem;
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: space-between
}

.block-row.active {
    border-color: #729cff;
    background: #eff4ff;
    color: #164fbf
}

.block-row span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.block-row small {
    color: #9ba7b9
}

.components {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    margin: 15px 0
}

.components button {
    font-size: .75rem;
    padding: 9px 5px
}

.editor-left h3 {
    margin: 20px 0 12px;
    font-size: .8125rem;
    color: #79859a
}

.editor-right .row {
    gap: 8px
}

.editor-right .row label {
    margin-top: 8px
}

.editor-subtabs {
    display: flex;
    gap: 6px;
    margin-bottom: 18px
}

.editor-subtabs button {
    flex: 1;
    padding: 8px 4px;
    font-size: .8125rem
}

.editor-subtabs .active {
    background: #eaf0ff;
    color: #1e50bd
}

.mini-actions {
    display: flex;
    gap: 5px;
    margin: 12px 0
}

.mini-actions button {
    flex: 1;
    padding: 7px 5px;
    min-height: 32px;
    font-size: .75rem
}

.field-card {
    border: 1px solid var(--line);
    border-radius: 9px;
    padding: 10px;
    margin: 12px 0
}

.field-card label {
    margin: 5px 0
}

.editor-right details {
    border-top: 1px solid var(--line);
    margin-top: 16px;
    padding-top: 12px
}

.editor-right summary {
    cursor: pointer;
    font-size: .875rem;
    font-weight: 600
}

.hint {
    font-size: .75rem;
    color: #748198;
    line-height: 1.6;
    margin-top: 8px
}

.editor-top .muted {
    font-size: .75rem
}

.inline-status {
    color: #a47018;
    font-size: .75rem
}

.mobile-menu {
    display: none
}

@media(min-width:1800px) {
    .editor {
        grid-template-columns: 240px minmax(300px, 1fr) 340px
    }
}

@media(max-width:1200px) {
    .shell {
        grid-template-columns: 190px minmax(0, 1fr)
    }

    .sidebar {
        padding: 22px 10px
    }

    .content {
        padding: 24px
    }

    .editor {
        grid-template-columns: 180px minmax(280px, 1fr) 270px
    }

    .editor-left,
    .editor-right {
        padding: 12px
    }

    .brand {
        font-size: .875rem
    }

    .topbar {
        padding: 0 22px
    }

    .grid3 {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width:1000px) {
    .shell {
        grid-template-columns: 1fr
    }

    .sidebar {
        display: none
    }

    .sidebar.open {
        display: flex;
        position: fixed;
        width: 230px;
        z-index: 20
    }

    .mobile-menu {
        display: block
    }

    .editor {
        grid-template-columns: 170px minmax(280px, 1fr)
    }

    .editor-right {
        grid-column: 1/-1;
        max-height: none;
        border-top: 1px solid var(--line)
    }

    .editor-canvas {
        min-height: 600px
    }

    .editor-left {
        max-height: 820px
    }

    .stats {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width:640px) {
    .content {
        padding: 18px
    }

    .topbar {
        padding: 0 16px;
        height: 62px
    }

    .page-title {
        flex-direction: column
    }

    .stats {
        gap: 10px
    }

    .card {
        padding: 16px
    }

    .grid2,
    .grid3 {
        grid-template-columns: 1fr
    }

    .login {
        grid-template-columns: 1fr
    }

    .login-intro {
        display: none
    }

    .login-panel {
        padding: 28px
    }

    .editor-top {
        flex-wrap: wrap
    }

    .editor {
        display: block
    }

    .editor-left {
        max-height: 340px
    }

    .editor-canvas {
        padding: 12px;
        min-height: 650px
    }

    .preview-frame {
        max-width: 100%;
        height: 620px
    }

    .editor-right {
        padding: 20px
    }

    .row {
        flex-wrap: wrap
    }

    .row>* {
        flex-basis: 130px
    }

    .toolbar input {
        max-width: none
    }

    .setting-tabs {
        flex-wrap: wrap
    }

    dialog .dialog-body {
        padding: 12px 18px
    }

    .brand {
        margin-bottom: 24px
    }
}

@media(prefers-reduced-motion:reduce) {
    * {
        scroll-behavior: auto !important;
        animation: none !important;
        transition: none !important
    }
}
.canvas-toolbar{display:flex;flex-wrap:wrap;gap:7px;align-items:center;padding:12px;background:#fff;border:1px solid #dce3ef;border-radius:12px;margin-bottom:16px;position:sticky;left:0}
.canvas-toolbar button{font-size:12px;padding:7px 10px;white-space:nowrap}
.layout-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.layout-grid input{min-width:0;width:100%}
.brand [data-site-name-label]{overflow-wrap:anywhere;min-width:0}

.template-cover{position:relative;overflow:hidden;min-height:210px;display:flex;align-items:flex-end!important;padding:18px!important}.template-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.template-cover strong{position:relative;z-index:1;background:#ffffffee;color:#18181c;border-radius:9px;padding:10px;font-size:15px;box-shadow:0 4px 20px #0001}
.editor-canvas .preview-frame{max-width:none}
/* Editor media selection: stay in the draft while choosing or uploading an asset. */
.image-picker{width:min(940px,calc(100vw - 28px));max-height:calc(100dvh - 28px);padding:0;overflow:auto}
.image-picker .dialog-head{position:sticky;top:0;z-index:2;background:#fff}.image-picker .dialog-head p{margin:6px 0 0;font-size:14px}.image-picker .dialog-foot{position:sticky;bottom:0;z-index:2;background:#fff}
.picker-tools{display:flex;gap:10px;padding:18px 24px 0;flex-wrap:wrap}.picker-tools input[type=search]{flex:1;min-width:160px;margin:0}.picker-tools button{white-space:nowrap}
.picker-status,.picker-error{margin:12px 24px;font-size:14px}.picker-error{color:#b42318;background:#fff0ed;padding:10px;border-radius:8px}
.picker-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding:8px 24px 20px}
.picker-card{padding:8px;border:2px solid #e3e9f3;border-radius:12px;text-align:left;display:flex;flex-direction:column;gap:7px;min-width:0;overflow:hidden;background:#fff}
.picker-card.selected{border-color:#246cfc;background:#eff5ff}.picker-card img{width:100%;aspect-ratio:4/3;object-fit:contain;background:repeating-conic-gradient(#eef1f5 0% 25%,#fff 0% 50%) 50% / 16px 16px;border-radius:6px}.picker-card strong{font-size:14px;font-weight:500;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.picker-card small{font-size:12px;color:#64748b}
.picker-card:disabled{opacity:.6;cursor:not-allowed}.picker-image-error{font-size:14px;padding:22px 5px;color:#a42620}.picker-empty{grid-column:1/-1;padding:44px 12px;text-align:center;color:#64748b;font-size:15px}
.picker-more{text-align:center;padding:0 20px 16px}.picker-selection{display:flex;align-items:center;gap:12px;margin:0 24px 16px;padding:10px;background:#f3f6fa;border-radius:10px;font-size:14px;overflow-wrap:anywhere}.picker-selection img{width:64px;height:48px;object-fit:contain;flex-shrink:0}
.editor-image-control{padding:12px 0;border-bottom:1px solid #edf0f5}.editor-image-control>.image-slot-label{font-size:14px;font-weight:600;margin:0 0 8px}.editor-image-thumb{position:relative;border:1px solid #e0e6f0;border-radius:10px;min-height:80px;background:repeating-conic-gradient(#eef1f5 0% 25%,#fff 0% 50%) 50% / 18px 18px;display:grid;place-items:center;overflow:hidden}.editor-image-thumb img{max-height:150px;width:100%;object-fit:contain}.editor-image-placeholder{font-size:14px;color:#64748b;padding:18px;text-align:center}.editor-image-failed{padding:16px;font-size:14px;color:#b42318;background:#fff5f3;text-align:center}.image-control-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.image-control-actions button{font-size:13px;min-height:36px;padding:6px 9px}.editor-image-control details{margin-top:8px}.editor-image-control details summary{font-size:13px}.editor-image-control .hint{font-size:13px;margin:8px 0 0}
@media(max-width:640px){.image-picker{width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}.picker-grid{grid-template-columns:repeat(2,minmax(0,1fr));padding:8px 14px 14px;gap:10px}.picker-tools{padding:14px 14px 0}.picker-status,.picker-error{margin-inline:14px}.picker-selection{margin-inline:14px}.picker-tools input[type=search]{flex-basis:100%}}

.image-picker [hidden],.editor-image-control [hidden]{display:none!important}
.visit-ip { margin-top: 7px; overflow-wrap: anywhere; }
.visit-ip code { font-size: 13px; user-select: all; }
.visit-copy { padding: 3px 8px; margin-inline-start: 8px; min-height: 30px; font-size: 12px; }
.visit-detail { min-width: 0; }
.visit-detail h3 { margin: 24px 0 12px; }
.visit-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.visit-metrics > div { padding: 14px; border-radius: 12px; background: #f2f6fc; }
.visit-metrics span { display: block; color: #53647e; font-size: 13px; }
.visit-metrics strong { display: block; font-size: 22px; margin-top: 6px; }
.visit-facts { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 24px; margin: 0; }
.visit-fact { padding: 10px 0; min-width: 0; border-bottom: 1px solid #e7edf5; }
.visit-fact dt { color: #61718b; font-size: 13px; margin-bottom: 5px; }
.visit-fact dd { margin: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.visit-source-facts .visit-fact:nth-child(-n+2) { grid-column: 1 / -1; }
.visit-events { list-style: none; margin: 12px 0 24px; padding: 0; }
.visit-events > li { position: relative; border-inline-start: 2px solid #d9e4f7; padding: 0 0 20px 20px; margin-inline-start: 6px; }
.visit-events > li::before { content: ''; position: absolute; width: 10px; height: 10px; inset-inline-start: -6px; top: 7px; background: #487eee; border-radius: 50%; }
.visit-event-heading { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 4px 16px; }
.visit-event-heading time { color: #61718b; font-size: 13px; }
.visit-event-target { margin: 8px 0; overflow-wrap: anywhere; }
.visit-technical { padding: 0; border: 0; margin: 8px 0 16px; }
.visit-technical summary { color: #61718b; font-size: 13px; cursor: pointer; }
.visit-technical dl { margin: 8px 0; }
@media (max-width: 640px) {
  .visit-facts { grid-template-columns: minmax(0,1fr); }
  .visit-metrics { gap: 6px; }
  .visit-metrics > div { padding: 10px 7px; }
  .visit-metrics strong { font-size: 18px; }
}