#mining-checker-app { --mc-surface: var(--surface); --mc-surface-strong: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(248,252,252,0.92)); --mc-line: var(--line); --mc-line-strong: color-mix(in srgb, var(--brand-accent) 28%, transparent); --mc-text: var(--text); --mc-text-muted: var(--muted); --mc-accent: var(--brand-accent); --mc-accent-strong: var(--brand-accent-3); --mc-danger: #d92d20; --mc-success: #14804a; --mc-warning: #b54708; min-height: 0; background: none; color: var(--mc-text); font-family: inherit; max-width: 100%; overflow-x: clip; } #mining-checker-app, #mining-checker-app * { box-sizing: border-box; } #mining-checker-app .mc-grid-bg { background: none; max-width: 100%; overflow-x: clip; } #mining-checker-app .mc-shell { width: 100%; max-width: 100%; margin: 0; padding: 0; } #mining-checker-app .mc-stack { display: grid; gap: 16px; } #mining-checker-app .mc-panel, #mining-checker-app .mc-stat-card, #mining-checker-app .mc-dashboard-card, #mining-checker-app .mc-target-card, #mining-checker-app .mc-alert, #mining-checker-app .mc-empty, #mining-checker-app .mc-table-shell, #mining-checker-app .mc-display-field { border: 1px solid var(--mc-line); border-radius: 22px; background: var(--mc-surface); /* box-shadow: 0 12px 30px rgba(1, 22, 32, 0.08); */ backdrop-filter: blur(8px); } #mining-checker-app .mc-panel, #mining-checker-app .mc-dashboard-card, #mining-checker-app .mc-alert, #mining-checker-app .mc-empty, #mining-checker-app .mc-table-shell { padding: 18px 20px; } #mining-checker-app .mc-hero-top, #mining-checker-app .mc-inline-row, #mining-checker-app .mc-flex-split, #mining-checker-app .mc-section-head { display: flex; gap: 16px; } #mining-checker-app .mc-hero-top, #mining-checker-app .mc-flex-split, #mining-checker-app .mc-section-head { justify-content: space-between; } #mining-checker-app .mc-hero-copy, #mining-checker-app .mc-hero-controls, #mining-checker-app .mc-panel-body, #mining-checker-app .mc-form, #mining-checker-app .mc-field, #mining-checker-app .mc-filter-grid, #mining-checker-app .mc-chart, #mining-checker-app .mc-target-grid { display: grid; gap: 14px; } #mining-checker-app .mc-filter-grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); } #mining-checker-app .mc-text, #mining-checker-app p, #mining-checker-app td, #mining-checker-app th, #mining-checker-app label, #mining-checker-app summary, #mining-checker-app pre { color: var(--mc-text-muted); } #mining-checker-app h1, #mining-checker-app h2, #mining-checker-app h3 { margin: 0; color: var(--mc-text); } #mining-checker-app .mc-stats-grid, #mining-checker-app .mc-target-grid, #mining-checker-app .mc-overview-grid, #mining-checker-app .mc-two-col, #mining-checker-app .mc-main-grid { display: grid; gap: 16px; } #mining-checker-app .mc-stats-grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); } #mining-checker-app .mc-overview-grid { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); } #mining-checker-app .mc-target-grid { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); } #mining-checker-app .mc-two-col { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); } #mining-checker-app .mc-main-grid { grid-template-columns: minmax(300px, 380px) minmax(0, 1fr); } #mining-checker-app .mc-stat-card, #mining-checker-app .mc-target-card { padding: 20px; } #mining-checker-app .mc-stat-card { background: var(--mc-surface-strong); } #mining-checker-app .mc-kicker { font-size: 0.76rem; text-transform: uppercase; letter-spacing: 0.18em; color: var(--mc-accent-strong); } #mining-checker-app .mc-stat-value { font-size: 2rem; font-weight: 700; line-height: 1.1; color: var(--mc-text); } #mining-checker-app .mc-badge { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 999px; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.18em; border: 1px solid var(--mc-line-strong); background: color-mix(in srgb, var(--mc-accent) 16%, transparent); color: var(--mc-accent-strong); } #mining-checker-app .mc-badge--warn { background: color-mix(in srgb, var(--mc-warning) 12%, transparent); color: var(--mc-warning); } #mining-checker-app .mc-badge--info { background: color-mix(in srgb, var(--mc-accent) 16%, transparent); color: var(--mc-accent-strong); } #mining-checker-app .mc-badge--danger { background: color-mix(in srgb, var(--mc-danger) 12%, transparent); color: var(--mc-danger); } #mining-checker-app .mc-badge--success { background: color-mix(in srgb, var(--mc-success) 12%, transparent); color: var(--mc-success); } #mining-checker-app .mc-button, #mining-checker-app button, #mining-checker-app input, #mining-checker-app select, #mining-checker-app textarea { font: inherit; } #mining-checker-app .mc-button { border: 1px solid transparent; border-radius: 16px; padding: 12px 16px; cursor: pointer; text-decoration: none; transition: 160ms ease; } #mining-checker-app .mc-button:hover { transform: translateY(-1px); } #mining-checker-app .mc-button:disabled { opacity: 0.6; cursor: default; transform: none; } #mining-checker-app .mc-button--primary { background: linear-gradient(135deg, var(--mc-accent), var(--mc-accent-strong)); color: #05121f; font-weight: 700; } #mining-checker-app .mc-button--secondary { background: rgba(255, 255, 255, 0.92); color: var(--mc-text); font-weight: 700; } #mining-checker-app .mc-button--danger { background: linear-gradient(135deg, rgba(251, 113, 133, 0.92), rgba(239, 68, 68, 0.92)); color: #fff7f7; font-weight: 700; } #mining-checker-app .mc-button--ghost { background: color-mix(in srgb, var(--mc-accent) 14%, transparent); border-color: color-mix(in srgb, var(--mc-accent) 34%, transparent); color: var(--mc-accent-strong); } #mining-checker-app .mc-debug-tools { display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-start; } #mining-checker-app .mc-debug-console { border-color: rgba(125, 211, 252, 0.28); } #mining-checker-app .mc-debug-view-switch { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 14px; } #mining-checker-app .mc-debug-log { display: grid; gap: 12px; max-height: 520px; overflow: auto; } #mining-checker-app .mc-debug-text-console { max-height: 520px; overflow: auto; white-space: pre-wrap; word-break: break-word; } #mining-checker-app .mc-debug-entry { border: 1px solid var(--mc-line); border-radius: 18px; padding: 14px 16px; background: color-mix(in srgb, var(--brand-accent-2) 8%, var(--mc-surface)); } #mining-checker-app .mc-field { gap: 8px; } #mining-checker-app .mc-field-label { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.18em; color: var(--mc-text-muted); } #mining-checker-app .mc-input, #mining-checker-app .mc-select, #mining-checker-app .mc-textarea, #mining-checker-app .mc-file { width: 100%; border: 1px solid var(--mc-line); border-radius: 16px; padding: 13px 15px; color: var(--mc-text); background: rgba(255, 255, 255, 0.72); outline: none; } #mining-checker-app .mc-select option { color: #09111f; background: #f8fafc; } #mining-checker-app .mc-textarea { min-height: 120px; resize: vertical; } #mining-checker-app .mc-input::placeholder, #mining-checker-app .mc-textarea::placeholder { color: #6d7c90; } #mining-checker-app .mc-input:focus, #mining-checker-app .mc-select:focus, #mining-checker-app .mc-textarea:focus, #mining-checker-app .mc-file:focus { border-color: rgba(125, 211, 252, 0.5); box-shadow: 0 0 0 3px rgba(125, 211, 252, 0.12); } #mining-checker-app .mc-checkbox { display: flex; align-items: center; gap: 12px; border: 1px solid var(--mc-line); border-radius: 16px; padding: 14px 16px; background: rgba(255, 255, 255, 0.05); } #mining-checker-app .mc-inline-fields { display: flex; flex-wrap: wrap; gap: 16px; align-items: end; } #mining-checker-app .mc-inline-fields > .mc-field { flex: 1 1 280px; } #mining-checker-app .mc-alert--error { border-color: rgba(251, 113, 133, 0.28); background: rgba(127, 29, 29, 0.35); color: #ffe4e6; } #mining-checker-app .mc-alert--warning { border-color: rgba(245, 158, 11, 0.28); background: rgba(120, 53, 15, 0.34); color: #fef3c7; } #mining-checker-app .mc-alert--success { border-color: rgba(52, 211, 153, 0.28); background: rgba(6, 78, 59, 0.34); color: #d1fae5; } #mining-checker-app .mc-table-shell { overflow: auto; padding: 0; } #mining-checker-app .mc-table { width: 100%; border-collapse: collapse; } #mining-checker-app .mc-table th, #mining-checker-app .mc-table td { padding: 14px 16px; border-bottom: 1px solid rgba(255, 255, 255, 0.06); text-align: left; vertical-align: top; } #mining-checker-app .mc-table thead { background: rgba(255, 255, 255, 0.04); } #mining-checker-app .mc-empty { border-style: dashed; } #mining-checker-app details { border: 1px solid var(--mc-line); border-radius: 18px; padding: 16px; background: rgba(255, 255, 255, 0.04); } #mining-checker-app pre { white-space: pre-wrap; margin: 12px 0 0; line-height: 1.65; } #mining-checker-app .mc-mini-grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); } #mining-checker-app .mc-mini-card, #mining-checker-app .mc-display-field { padding: 12px 14px; background: rgba(255, 255, 255, 0.04); } #mining-checker-app .mc-code-block { margin: 0; padding: 12px 14px; border: 1px solid var(--mc-line); border-radius: 16px; background: rgba(255, 255, 255, 0.03); white-space: pre-wrap; word-break: break-word; font-family: "JetBrains Mono", "SFMono-Regular", monospace; font-size: 0.92rem; line-height: 1.6; } #mining-checker-app .mc-chart svg { width: 100%; height: 220px; } #mining-checker-app .mc-modal-backdrop { position: fixed; inset: 0; z-index: 80; display: flex; align-items: center; justify-content: center; padding: 20px; background: rgba(2, 6, 23, 0.72); } #mining-checker-app .mc-modal { width: min(720px, 100%); max-height: min(80vh, 900px); overflow: auto; padding: 24px; border: 1px solid var(--mc-line); border-radius: 28px; background: rgba(9, 17, 31, 0.96); box-shadow: 0 28px 60px rgba(0, 0, 0, 0.34); backdrop-filter: blur(14px); } #mining-checker-app .mc-chart path, #mining-checker-app .mc-chart polyline, #mining-checker-app .mc-chart line, #mining-checker-app .mc-chart rect { vector-effect: non-scaling-stroke; } @media (max-width: 960px) { #mining-checker-app .mc-hero-top, #mining-checker-app .mc-inline-row, #mining-checker-app .mc-flex-split, #mining-checker-app .mc-section-head { flex-direction: column; align-items: stretch; } #mining-checker-app .mc-main-grid { grid-template-columns: 1fr; } #mining-checker-app .mc-shell { width: min(100% - 10px, 1360px); padding: 8px 0 20px; } #mining-checker-app .mc-stack { gap: 14px; } #mining-checker-app .mc-hero, #mining-checker-app .mc-panel, #mining-checker-app .mc-dashboard-card, #mining-checker-app .mc-alert, #mining-checker-app .mc-empty, #mining-checker-app .mc-table-shell { padding: 14px; border-radius: 20px; } #mining-checker-app .mc-title { font-size: clamp(1.45rem, 8vw, 2.15rem); } #mining-checker-app .mc-hero-copy { gap: 8px; } #mining-checker-app .mc-hero-copy p { margin: 0; } #mining-checker-app .mc-hero-controls { grid-template-columns: 1fr; } #mining-checker-app .mc-home-link { justify-self: stretch; justify-content: center; } #mining-checker-app .mc-tabs { flex-wrap: nowrap; gap: 8px; margin: 12px -4px 0; padding: 0 4px 4px; overflow-x: auto; scrollbar-width: thin; } #mining-checker-app .mc-button { padding: 10px 12px; border-radius: 14px; } #mining-checker-app .mc-button--tab { flex: 0 0 auto; white-space: nowrap; } #mining-checker-app .mc-table th, #mining-checker-app .mc-table td { padding: 10px 12px; } #mining-checker-app .mc-modal { max-height: min(92vh, 900px); padding: 16px; border-radius: 20px; } } @media (max-width: 600px) { #mining-checker-app, #mining-checker-app * { max-width: 100%; } #mining-checker-app { min-height: 100vh; overflow-x: hidden; } #mining-checker-app .mc-grid-bg { overflow-x: hidden; background-size: 18px 18px; } #mining-checker-app .mc-shell { width: 100%; padding: 0 0 16px; } #mining-checker-app .mc-stack { gap: 12px; } #mining-checker-app .mc-hero, #mining-checker-app .mc-panel, #mining-checker-app .mc-dashboard-card, #mining-checker-app .mc-alert, #mining-checker-app .mc-empty { width: 100%; border-radius: 18px; padding: 14px; box-shadow: 0 14px 32px rgba(0, 0, 0, 0.16); } #mining-checker-app .mc-hero { border-radius: 0 0 18px 18px; } #mining-checker-app .mc-panel, #mining-checker-app .mc-dashboard-card, #mining-checker-app .mc-alert, #mining-checker-app .mc-empty, #mining-checker-app .mc-table-shell { border-left: 0; border-right: 0; } #mining-checker-app .mc-title, #mining-checker-app .mc-hero-copy p { display: none; } #mining-checker-app .mc-hero-top { gap: 10px; } #mining-checker-app .mc-kicker { font-size: 0.68rem; letter-spacing: 0.14em; } #mining-checker-app .mc-tabs { margin: 10px -6px 0; padding: 0 6px 6px; gap: 6px; } #mining-checker-app .mc-button { min-height: 38px; padding: 8px 10px; border-radius: 12px; font-size: 0.92rem; } #mining-checker-app .mc-button:hover { transform: none; } #mining-checker-app .mc-stats-grid, #mining-checker-app .mc-target-grid, #mining-checker-app .mc-overview-grid, #mining-checker-app .mc-two-col, #mining-checker-app .mc-main-grid, #mining-checker-app .mc-filter-grid, #mining-checker-app .mc-mini-grid { grid-template-columns: minmax(0, 1fr); gap: 10px; } #mining-checker-app .mc-stat-card, #mining-checker-app .mc-target-card, #mining-checker-app .mc-mini-card, #mining-checker-app .mc-display-field { padding: 12px; border-radius: 16px; } #mining-checker-app .mc-stat-value { font-size: clamp(1.45rem, 8vw, 1.85rem); overflow-wrap: anywhere; } #mining-checker-app h2 { font-size: 1.25rem; } #mining-checker-app h3 { font-size: 1.05rem; } #mining-checker-app .mc-text, #mining-checker-app p, #mining-checker-app td, #mining-checker-app th, #mining-checker-app label, #mining-checker-app summary, #mining-checker-app pre { font-size: 0.92rem; } #mining-checker-app .mc-input, #mining-checker-app .mc-select, #mining-checker-app .mc-textarea, #mining-checker-app .mc-file { min-width: 0; padding: 10px 12px; border-radius: 12px; font-size: 16px; } #mining-checker-app .mc-inline-fields, #mining-checker-app .mc-debug-tools, #mining-checker-app .mc-debug-view-switch { gap: 8px; } #mining-checker-app .mc-inline-fields > .mc-field { flex-basis: 100%; min-width: 0; } #mining-checker-app .mc-badge { padding: 7px 10px; font-size: 0.78rem; } #mining-checker-app .mc-table-shell { width: 100%; max-width: 100%; border-radius: 16px; overflow-x: auto; -webkit-overflow-scrolling: touch; } #mining-checker-app .mc-table { max-width: none; min-width: 640px; } #mining-checker-app .mc-table th, #mining-checker-app .mc-table td { padding: 9px 10px; font-size: 0.86rem; } #mining-checker-app .mc-chart svg { height: 180px; } #mining-checker-app .mc-modal-backdrop { align-items: stretch; padding: 8px; } #mining-checker-app .mc-modal { width: 100%; max-height: calc(100vh - 16px); padding: 14px; border-radius: 18px; } }