:root {
    color-scheme: light;
    --lottery-bg: #f4f7fb;
    --lottery-surface: #fff;
    --lottery-sidebar: #101b31;
    --lottery-sidebar-muted: #9cabc4;
    --lottery-text: #16243a;
    --lottery-muted: #718096;
    --lottery-border: #e4eaf2;
    --lottery-primary: #4f6df5;
    --lottery-primary-soft: #edf0ff;
    --lottery-green: #1b9b75;
    --lottery-shadow: 0 12px 32px rgba(27, 44, 75, .055);
    font-family: Inter, "Segoe UI", Tahoma, sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; color: var(--lottery-text); background: var(--lottery-bg); }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.lottery-shell { min-height: 100vh; display: flex; }

.lottery-sidebar {
    width: 258px;
    min-width: 258px;
    min-height: 100vh;
    padding: 22px 15px 16px;
    background: var(--lottery-sidebar);
    color: #fff;
    display: flex;
    flex-direction: column;
    position: sticky;
    top: 0;
    height: 100vh;
    z-index: 20;
}
.sidebar-toggle { position: absolute; top: 27px; right: 12px; width: 23px; height: 23px; display: grid; place-items: center; border: 1px solid #34425b; border-radius: 6px; background: #18253c; color: #b7c3d6; font-size: calc(15px + 4px); }
.lottery-shell.is-collapsed .lottery-sidebar { width: 74px; min-width: 74px; padding-left: 10px; padding-right: 10px; }
.lottery-shell.is-collapsed .brand { justify-content: center; padding-left: 0; padding-right: 0; }
.lottery-shell.is-collapsed .brand > span:not(.brand-mark), .lottery-shell.is-collapsed .sidebar-search input, .lottery-shell.is-collapsed .sidebar-search kbd, .lottery-shell.is-collapsed .sidebar-personal, .lottery-shell.is-collapsed .sidebar-foot span:not(.status-dot), .lottery-shell.is-collapsed .nav-caption { display: none; }
.lottery-shell.is-collapsed .sidebar-toggle { right: 5px; top: 68px; }
.lottery-shell.is-collapsed .sidebar-search { justify-content: center; padding: 0; }
.lottery-shell.is-collapsed .nav-item { justify-content: center; padding: 11px 5px; font-size: 0; }
.lottery-shell.is-collapsed .nav-item span { font-size: calc(16px + 4px); }
.lottery-shell.is-collapsed .sidebar-foot { justify-content: center; }
.brand { display: flex; align-items: center; gap: 11px; color: #fff; text-decoration: none; padding: 2px 8px 26px; }
.brand-mark { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; background: linear-gradient(135deg, #6e80ff, #4a5be3); font-size: calc(25px + 4px); font-weight: 800; }
.brand strong, .brand small { display: block; }
.brand strong { font-size: calc(15px + 4px); letter-spacing: .01em; }
.brand small { color: #9eacc2; margin-top: 3px; font-size: calc(10px + 4px); letter-spacing: .08em; text-transform: uppercase; }
.sidebar-search { display: flex; align-items: center; gap: 8px; padding: 0 10px; height: 40px; color: #9aabc5; border: 1px solid #293751; background: #18253c; border-radius: 9px; }
.sidebar-search input { min-width: 0; flex: 1; background: transparent; border: 0; outline: 0; color: #fff; font-size: calc(12px + 4px); }
.sidebar-search input::placeholder { color: #98a8c0; }
.sidebar-search kbd { color: #8d9cb2; font-size: calc(10px + 4px); border: 1px solid #42506a; padding: 1px 5px; border-radius: 4px; }
.tool-nav { display: flex; flex-direction: column; gap: 4px; padding-top: 20px; overflow-y: auto; }
.nav-caption { display: block; color: #8190a9; font-size: calc(9px + 4px); letter-spacing: .13em; font-weight: 700; padding: 13px 10px 6px; }
.nav-item { width: 100%; text-align: left; display: flex; align-items: center; gap: 12px; border: 0; background: transparent; color: #bac6d8; padding: 10px 11px; border-radius: 8px; font-size: calc(12px + 4px); transition: .15s ease; text-decoration: none; }
.nav-item span { width: 17px; color: #9cacc6; text-align: center; font-size: calc(15px + 4px); }
.nav-item:hover { background: #1b2a45; color: #fff; }
.nav-item.is-active { color: #fff; background: #2a3b60; box-shadow: inset 3px 0 #8291ff; }
.nav-item.is-active span { color: #aab4ff; }
.sidebar-personal { margin-top: auto; min-height: 55px; }
.personal-list { display: flex; flex-direction: column; }
.personal-list button { background: transparent; border: 0; color: #aab7ca; text-align: left; font-size: calc(11px + 4px); padding: 5px 10px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.personal-list button:hover { color: #fff; }
.sidebar-foot { border-top: 1px solid #293751; padding: 15px 8px 0; margin-top: 12px; display: flex; gap: 9px; align-items: center; color: #aab7ca; font-size: calc(10px + 4px); }
.status-dot, .connection-pill i { width: 7px; height: 7px; border-radius: 50%; display: inline-block; background: #a6b0c0; flex: 0 0 auto; }
.status-dot.is-connected, .connection-pill.is-connected i { background: #34c58b; box-shadow: 0 0 0 3px rgba(52, 197, 139, .13); }
.status-dot.is-error, .connection-pill.is-error i { background: #f57676; }

.lottery-main { min-width: 0; flex: 1; }
.topbar { height: 72px; background: rgba(255,255,255,.92); border-bottom: 1px solid var(--lottery-border); display: flex; align-items: center; justify-content: space-between; padding: 0 34px; position: sticky; top: 0; z-index: 10; backdrop-filter: blur(12px); }
.topbar-title { display: flex; flex-direction: column; gap: 2px; }
.topbar-title strong { font-size: calc(14px + 4px); }
.eyebrow { color: #8794a8; font-size: calc(9px + 4px); letter-spacing: .13em; font-weight: 750; }
.topbar-actions { display: flex; align-items: center; gap: 16px; }
.topbar-date { color: var(--lottery-muted); font-size: calc(11px + 4px); }
.connection-pill { display: inline-flex; align-items: center; gap: 8px; border-radius: 30px; background: #f0f3f8; padding: 7px 10px; font-size: calc(10px + 4px); color: #64748b; }
.connection-pill.is-connected { color: #137955; background: #e9f8f2; }
.connection-pill.is-error { color: #a73535; background: #fff0ef; }
.icon-button, .language-button { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--lottery-border); border-radius: 9px; color: #51627a; background: var(--lottery-surface); }
.language-button { width: auto; padding: 0 9px; font-size: calc(10px + 4px); font-weight: 700; }
.mobile-menu { display: none; }
.workspace { max-width: 1500px; margin: 0 auto; padding: 28px 34px 20px; }
.view-panel { display: none; }
.view-panel.is-visible { display: block; animation: panel-in .18s ease-out; }
@keyframes panel-in { from { opacity: .5; transform: translateY(3px); } to { opacity: 1; transform: none; } }
.page-intro { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 3px 0 22px; }
.page-intro.compact { margin-bottom: 18px; }
.page-intro h1 { font-size: calc(clamp(22px, 2.4vw, 29px) + 4px); margin: 6px 0; letter-spacing: -.035em; }
.page-intro p { margin: 0; color: var(--lottery-muted); font-size: calc(12px + 4px); }
.button { min-height: 38px; border-radius: 8px; border: 1px solid transparent; padding: 0 14px; font-size: calc(11px + 4px); font-weight: 650; transition: .15s ease; }
.button-primary { background: var(--lottery-primary); color: #fff; box-shadow: 0 4px 10px rgba(79,109,245,.18); }
.button-primary:hover { background: #405ce3; transform: translateY(-1px); }
.button-secondary { border-color: var(--lottery-border); background: var(--lottery-surface); color: #54647a; }
.button-secondary:hover { border-color: #bcc7d7; color: var(--lottery-text); }
.text-button { color: var(--lottery-primary); background: none; border: 0; font-size: calc(10px + 4px); font-weight: 700; }
.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 16px; }
.metric-card, .surface-card { background: var(--lottery-surface); border: 1px solid var(--lottery-border); border-radius: 12px; box-shadow: var(--lottery-shadow); }
.metric-card { min-height: 112px; padding: 17px 18px; display: flex; flex-direction: column; align-items: flex-start; }
.metric-card > span { color: var(--lottery-muted); font-size: calc(10px + 4px); }
.metric-card strong { display: block; margin: 11px 0 4px; color: var(--lottery-text); font-size: calc(23px + 4px); letter-spacing: -.03em; }
.metric-card small { color: #9aa5b4; font-size: calc(9px + 4px); }
.metric-card .metric-date { font-size: calc(17px + 4px); }
.metric-card .metric-connected { font-size: calc(16px + 4px); color: var(--lottery-green); }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, .9fr); gap: 15px; margin-bottom: 15px; }
.dashboard-grid > * { min-width: 0; }
.calendar-analysis-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.calendar-analysis-card { min-width: 0; margin-bottom: 0; }
.calendar-analysis-card .card-heading { margin-bottom: 12px; }
.calendar-section-title { margin: 14px 0 8px; color: var(--lottery-muted); font-size: calc(10px + 4px); }
.calendar-number-list { margin: 0; padding: 0; list-style: none; }
.calendar-number-list li { display: flex; justify-content: space-between; gap: 8px; padding: 7px 0; border-bottom: 1px solid var(--lottery-border); }
.calendar-number-list li strong { color: var(--lottery-primary); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.calendar-number-list li span { color: var(--lottery-muted); font-size: calc(9px + 4px); text-align: right; }
.calendar-digit-list { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.programs-intro { align-items: flex-end; }
.program-search { width: min(100%, 290px); min-width: 220px; height: 40px; display: flex; align-items: center; gap: 9px; padding: 0 11px; border: 1px solid var(--lottery-border); border-radius: 9px; background: var(--lottery-surface); color: var(--lottery-muted); }
.program-search input { min-width: 0; border: 0; padding: 0; box-shadow: none; background: transparent; font-size: calc(11px + 4px); }
.program-search input:focus { box-shadow: none; }
.program-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 15px; }
.program-card { min-width: 0; overflow: hidden; display: flex; flex-direction: column; border: 1px solid var(--lottery-border); border-radius: 12px; background: var(--lottery-surface); box-shadow: var(--lottery-shadow); transition: transform .16s ease, box-shadow .16s ease; }
.program-card:hover { transform: translateY(-2px); box-shadow: 0 15px 32px rgba(27, 44, 75, .1); }
.program-card > img { display: block; width: 100%; aspect-ratio: 5 / 3; object-fit: cover; background: var(--lottery-bg); border-bottom: 1px solid var(--lottery-border); }
.program-card-content { flex: 1; padding: 14px 15px 8px; }
.program-category { display: inline-block; color: var(--lottery-primary); background: var(--lottery-primary-soft); border-radius: 20px; padding: 4px 8px; font-size: calc(9px + 4px); font-weight: 700; }
.program-card h2 { margin: 10px 0 5px; font-size: calc(14px + 4px); }
.program-card p { margin: 0; min-height: 34px; color: var(--lottery-muted); font-size: calc(10px + 4px); line-height: 1.6; }
.program-open { align-self: flex-start; margin: 8px 15px 15px; padding: 8px 10px; border: 0; border-radius: 7px; color: var(--lottery-primary); background: var(--lottery-primary-soft); text-decoration: none; font-size: calc(10px + 4px); font-weight: 700; }
.program-open:hover { filter: brightness(.97); }
.program-empty { grid-column: 1 / -1; padding: 32px; border: 1px dashed var(--lottery-border); border-radius: 10px; color: var(--lottery-muted); text-align: center; font-size: calc(12px + 4px); }
.surface-card { padding: 19px; margin-bottom: 15px; }
.card-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.card-heading h2, .surface-card > h2 { margin: 0; font-size: calc(13px + 4px); letter-spacing: -.01em; }
.card-heading p { color: var(--lottery-muted); font-size: calc(10px + 4px); margin: 5px 0 0; }
.card-badge { border-radius: 5px; background: var(--lottery-primary-soft); color: var(--lottery-primary); padding: 5px 7px; font-size: calc(8px + 4px); letter-spacing: .08em; font-weight: 700; }
.card-tools { display: flex; align-items: center; gap: 7px; }
.chart-export { border: 1px solid var(--lottery-border); border-radius: 5px; padding: 4px 7px; background: var(--lottery-surface); color: var(--lottery-muted); font-size: calc(8px + 4px); font-weight: 700; }
.chart-export:hover { border-color: var(--lottery-primary); color: var(--lottery-primary); }
.chart-card { min-width: 0; overflow: hidden; }
.chart-card canvas { display: block; width: 100%; min-width: 0; max-width: 100%; min-height: 0; }
.type-card-list { display: flex; flex-direction: column; gap: 5px; max-height: 280px; overflow: auto; }
.type-card { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; text-align: left; padding: 9px 10px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--lottery-text); }
.type-card-open { flex: 1; min-width: 0; border: 0; padding: 0; background: transparent; color: inherit; text-align: left; }
.favorite-toggle { border: 0; background: transparent; color: #e2a72e; font-size: calc(16px + 4px); }
.type-card:hover { background: var(--lottery-bg); border-color: var(--lottery-border); }
.type-card strong { display: block; font-size: calc(10px + 4px); font-weight: 650; }
.type-card small { display: block; color: var(--lottery-muted); font-size: calc(9px + 4px); margin-top: 4px; }
.type-card .type-count { color: var(--lottery-primary); font-size: calc(10px + 4px); white-space: nowrap; font-weight: 700; }
.table-wrap { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; text-align: left; }
th { padding: 10px 11px; border-bottom: 1px solid var(--lottery-border); color: #8794a8; font-size: calc(9px + 4px); font-weight: 700; letter-spacing: .04em; white-space: nowrap; }
td { padding: 11px; border-bottom: 1px solid var(--lottery-border); color: var(--lottery-text); font-size: calc(10px + 4px); white-space: nowrap; }
tbody tr:last-child td { border-bottom: 0; }
td.result-value { color: var(--lottery-primary); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-weight: 750; letter-spacing: .14em; }
.empty-cell { color: var(--lottery-muted); text-align: center; padding: 26px; }
.disclaimer, .notice { color: #8c7890; font-size: calc(10px + 4px); line-height: 1.6; margin: 13px 2px; }
.notice { padding: 10px 12px; color: #85691f; background: #fff8df; border: 1px solid #f4e8bd; border-radius: 7px; }
.global-error { margin: 0 0 14px; padding: 11px 13px; border: 1px solid #f5cac7; background: #fff1f0; border-radius: 8px; color: #973b35; font-size: calc(11px + 4px); }
.muted { color: var(--lottery-muted); font-size: calc(11px + 4px); }
.filter-grid { display: grid; grid-template-columns: repeat(4, minmax(120px, 1fr)); align-items: end; gap: 11px; margin-bottom: 15px; }
.filter-grid label, .inline-form label, .stack-form label, .embed-select-label { display: flex; flex-direction: column; gap: 6px; color: #718096; font-size: calc(9px + 4px); font-weight: 650; }
.trend-window-filter { display: flex; flex: 0 0 130px; flex-direction: column; gap: 6px; width: 130px; color: var(--lottery-muted); font-size: calc(9px + 4px); font-weight: 650; }
input, select, textarea { width: 100%; border: 1px solid var(--lottery-border); border-radius: 7px; background: var(--lottery-surface); color: var(--lottery-text); outline: none; padding: 9px 10px; font-size: calc(10px + 4px); }
input:focus, select:focus, textarea:focus { border-color: #8293ff; box-shadow: 0 0 0 3px rgba(79,109,245,.11); }
select[multiple] { min-height: 140px; }
.table-meta { color: var(--lottery-muted); font-size: calc(9px + 4px); min-height: 16px; margin-bottom: 7px; }
.pagination { display: flex; justify-content: center; align-items: center; gap: 15px; margin-top: 15px; color: var(--lottery-muted); font-size: calc(10px + 4px); }
.inline-form { display: flex; align-items: end; gap: 10px; margin-bottom: 14px; }
.inline-form label { flex: 1; }
.stack-form { display: flex; flex-direction: column; gap: 10px; }
.result-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.result-item { min-width: 0; border: 1px solid var(--lottery-border); background: var(--lottery-bg); border-radius: 8px; padding: 10px; }
.result-item span { display: block; color: var(--lottery-muted); font-size: calc(9px + 4px); }
.result-item strong { display: block; color: var(--lottery-text); font-size: calc(13px + 4px); margin-top: 5px; word-break: break-word; }
.calculation-output { border-radius: 8px; padding: 10px; margin-top: 12px; color: var(--lottery-primary); background: var(--lottery-primary-soft); font-size: calc(11px + 4px); word-break: break-all; }
.frequency-list { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; margin-top: 10px; }
.frequency-item { text-align: center; background: var(--lottery-bg); border-radius: 6px; padding: 8px 3px; }
.frequency-item span { display: block; color: var(--lottery-muted); font-size: calc(9px + 4px); }
.frequency-item strong { display: block; font-size: calc(11px + 4px); margin-top: 4px; }
.pattern-list { display: flex; flex-direction: column; gap: 8px; }
.pattern-row { display: flex; justify-content: space-between; gap: 10px; padding: 10px 11px; background: var(--lottery-bg); border-radius: 7px; font-size: calc(10px + 4px); }
.pattern-row span { color: var(--lottery-muted); }
.pattern-row strong { color: var(--lottery-text); }
.comparison-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; margin-top: 17px; }
.comparison-card { border: 1px solid var(--lottery-border); border-radius: 9px; padding: 13px; }
.comparison-card h3 { margin: 0 0 9px; font-size: calc(11px + 4px); }
.comparison-card .frequency-item { display: inline-block; width: 19%; margin: 1px; }
.correlation-card { grid-column: 1 / -1; }
.highlight-method { margin-top: 15px; }
.highlight-method .notice { margin-bottom: 0; }
.highlights-list { display: flex; flex-direction: column; gap: 2px; }
.highlight-type-card { overflow: hidden; }
.highlight-length-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.highlight-length { min-width: 0; padding: 13px; border: 1px solid var(--lottery-border); border-radius: 10px; background: var(--lottery-bg); }
.highlight-length-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.highlight-length-heading h3 { margin: 0; font-size: calc(12px + 4px); }
.highlight-length-heading > span { color: var(--lottery-muted); font-size: calc(9px + 4px); }
.highlight-number-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(175px, 1fr)); gap: 8px; }
.highlight-number { min-width: 0; padding: 11px; border: 1px solid var(--lottery-border); border-radius: 8px; background: var(--lottery-surface); }
.highlight-number-heading, .highlight-score-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.highlight-number-value { color: var(--lottery-primary); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: calc(24px + 4px); letter-spacing: .08em; }
.highlight-rank { color: var(--lottery-muted); font-size: calc(9px + 4px); }
.trend-change { font-size: calc(9px + 4px); font-weight: 700; text-align: right; }
.trend-change.is-up { color: var(--lottery-green); }
.trend-change.is-down { color: #d26b6b; }
.trend-change.is-unchanged { color: var(--lottery-muted); }
.highlight-score-header { margin-top: 7px; color: var(--lottery-muted); font-size: calc(9px + 4px); }
.highlight-score-header strong { color: var(--lottery-text); font-size: calc(10px + 4px); }
.highlight-score-track { height: 5px; margin-top: 5px; overflow: hidden; border-radius: 5px; background: var(--lottery-border); }
.highlight-score-track span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #6178f3, #35b18c); }
.highlight-number-meta, .highlight-number-gap { margin: 8px 0 0; color: var(--lottery-muted); font-size: calc(9px + 4px); line-height: 1.5; }
.highlight-components { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 9px; }
.highlight-components span { padding: 4px 5px; border-radius: 4px; background: var(--lottery-primary-soft); color: var(--lottery-primary); font-size: calc(8px + 4px); }
.number-tool-card { padding: 18px; }
.number-set-output { display: grid; grid-template-columns: repeat(auto-fill, minmax(56px, 1fr)); gap: 7px; margin-top: 12px; }
.number-set-copy { grid-column: 1 / -1; justify-self: start; margin-top: 6px; }
.number-set-copy-status { grid-column: 1 / -1; color: var(--lottery-green); font-size: calc(12px + 4px); }
.number-set-item { display: flex; min-height: 38px; align-items: center; justify-content: center; border: 1px solid var(--lottery-border); border-radius: 7px; background: var(--lottery-bg); color: var(--lottery-primary); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: calc(15px + 4px); font-weight: 750; letter-spacing: .06em; }
.flow-number-item { flex-direction: column; gap: 3px; }
.flow-number-item strong { color: var(--lottery-text); font-size: calc(14px + 4px); }
.digit-summary-card { min-width: 0; padding: 15px; }
.digit-summary-card h2 { margin: 0; font-size: calc(12px + 4px); }
.game-output { min-height: 100px; padding: 14px; }
.game-output-ready { display: grid; place-items: center; }
.game-result { text-align: center; }
.game-ticket { display: block; color: var(--lottery-primary); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: calc(44px + 4px); letter-spacing: .12em; }
.game-result p { font-size: calc(11px + 4px); }
.game-match { color: var(--lottery-green); font-weight: 700; }
.number-tool-card .inline-form { flex-wrap: wrap; }
.digit-keypad { display: grid; flex: 1 0 100%; grid-template-columns: repeat(10, minmax(30px, 1fr)); gap: 6px; }
.digit-key { min-height: 38px; border: 1px solid var(--lottery-border); border-radius: 7px; background: var(--lottery-bg); color: var(--lottery-text); font-size: calc(14px + 4px); font-weight: 700; }
.digit-key:hover { border-color: var(--lottery-primary); color: var(--lottery-primary); }
.digit-key.is-selected { border-color: var(--lottery-primary); background: var(--lottery-primary-soft); color: var(--lottery-primary); box-shadow: inset 0 0 0 1px var(--lottery-primary); }
.digit-key:disabled { cursor: not-allowed; opacity: .45; }
.digit-key-action { color: var(--lottery-muted); font-size: calc(11px + 4px); }
.highlight-truncated { color: #966d14; background: #fff3d4; }
.lottery-dark .highlight-truncated { color: #f2d887; background: #3a3420; }
.plain-list { color: var(--lottery-muted); font-size: calc(11px + 4px); line-height: 1.9; padding-left: 20px; }
.plain-list code { color: var(--lottery-primary); }
.embed-preview { border: 1px solid var(--lottery-border); border-radius: 10px; overflow: hidden; margin: 14px 0; background: var(--lottery-bg); }
.embed-preview iframe { width: 100%; border: 0; display: block; min-height: 500px; }
.snippet-label { display: block; color: var(--lottery-muted); font-size: calc(9px + 4px); }
.snippet-label textarea { margin-top: 6px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: calc(9px + 4px); resize: vertical; }
.workspace-footer { display: flex; justify-content: space-between; gap: 12px; color: #9aa5b4; font-size: calc(9px + 4px); padding: 10px 2px 0; }

.lottery-embed { background: var(--lottery-bg); }
.embed-shell { max-width: 920px; padding: 17px; margin: auto; }
.embed-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 0 2px 14px; }
.embed-heading h1 { font-size: calc(18px + 4px); margin: 4px 0 0; }
.embed-heading a { color: var(--lottery-primary); font-size: calc(10px + 4px); text-decoration: none; }
.embed-select-label { margin-bottom: 12px; }
.embed-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 12px; }
.embed-metrics article { padding: 11px 13px; background: var(--lottery-surface); border: 1px solid var(--lottery-border); border-radius: 9px; }
.embed-metrics span, .embed-metrics strong { display: block; }
.embed-metrics span { color: var(--lottery-muted); font-size: calc(9px + 4px); }
.embed-metrics strong { margin-top: 5px; font-size: calc(15px + 4px); }
.embed-results { padding-bottom: 5px; }
.embed-shell .surface-card { padding: 14px; }
.embed-shell .disclaimer { margin: 9px 2px; }
.embed-shell canvas { min-height: 145px; }
.embedded-title { display: none; }

.lottery-dark {
    color-scheme: dark;
    --lottery-bg: #101827;
    --lottery-surface: #182235;
    --lottery-sidebar: #0c1422;
    --lottery-text: #edf2fb;
    --lottery-muted: #a2b0c4;
    --lottery-border: #29364b;
    --lottery-primary: #8092ff;
    --lottery-primary-soft: #242d50;
    --lottery-green: #55d5a5;
    --lottery-shadow: 0 12px 32px rgba(0,0,0,.12);
}
.lottery-dark .topbar { background: rgba(24,34,53,.94); }
.lottery-dark .nav-item:hover { background: #1c2a42; }
.lottery-dark .connection-pill { background: #202c40; }
.lottery-dark .connection-pill.is-connected { background: #173c35; }
.lottery-dark .connection-pill.is-error { background: #432b32; }
.lottery-dark th { color: #a5b1c2; }
.lottery-dark .notice { color: #f2d887; background: #3a3420; border-color: #59502f; }
.lottery-dark .global-error { background: #432b32; border-color: #633b42; color: #ffc9c6; }
.lottery-dark .type-card:hover { background: #202c40; }

@media (max-width: 1050px) {
    .lottery-sidebar { width: 225px; min-width: 225px; }
    .workspace { padding-left: 22px; padding-right: 22px; }
    .topbar { padding: 0 22px; }
    .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .program-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .lottery-sidebar { position: fixed; left: 0; top: 0; transform: translateX(-105%); transition: transform .2s ease; width: 265px; }
    .lottery-sidebar.is-open { transform: translateX(0); box-shadow: 20px 0 50px rgba(0,0,0,.25); }
    .lottery-shell.is-collapsed .lottery-sidebar { width: 265px; min-width: 265px; padding: 22px 15px 16px; }
    .lottery-shell.is-collapsed .brand { justify-content: flex-start; padding: 2px 8px 26px; }
    .lottery-shell.is-collapsed .brand > span:not(.brand-mark), .lottery-shell.is-collapsed .sidebar-search input, .lottery-shell.is-collapsed .sidebar-search kbd, .lottery-shell.is-collapsed .sidebar-personal, .lottery-shell.is-collapsed .sidebar-foot span:not(.status-dot), .lottery-shell.is-collapsed .nav-caption { display: initial; }
    .lottery-shell.is-collapsed .sidebar-toggle { right: 12px; top: 27px; }
    .lottery-shell.is-collapsed .sidebar-search { justify-content: flex-start; padding: 0 10px; }
    .lottery-shell.is-collapsed .nav-item { justify-content: flex-start; padding: 10px 11px; font-size: calc(12px + 4px); }
    .lottery-shell.is-collapsed .nav-item span { font-size: calc(15px + 4px); }
    .lottery-shell.is-collapsed .sidebar-foot { justify-content: flex-start; }
    .mobile-menu { display: grid; margin-right: 10px; }
    .topbar { height: 62px; padding: 0 13px; justify-content: flex-start; }
    .topbar-title { flex: 1; }
    .topbar-actions { gap: 7px; }
    .topbar-date, #language-toggle { display: none; }
    .connection-pill { padding: 7px; }
    .connection-pill span { display: none; }
    .workspace { padding: 20px 13px; }
    .page-intro { align-items: flex-start; }
    .programs-intro { align-items: stretch; }
    .program-search { width: 100%; }
    .page-intro > .button { align-self: center; padding: 0 9px; }
    .dashboard-grid { grid-template-columns: 1fr; }
    .calendar-analysis-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .program-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    .highlight-length-grid { grid-template-columns: 1fr; gap: 9px; }
    .number-tool-card .inline-form { align-items: stretch; flex-direction: column; }
    .number-tool-card .inline-form .button { width: 100%; }
    .digit-keypad { grid-template-columns: repeat(5, minmax(36px, 1fr)); }
    .program-card-content { padding: 9px 9px 5px; }
    .program-category { padding: 3px 6px; font-size: calc(8px + 4px); }
    .program-card h2 { margin: 7px 0 4px; font-size: calc(11px + 4px); }
    .program-card p { min-height: 0; font-size: calc(9px + 4px); line-height: 1.45; }
    .program-open { margin: 7px 9px 9px; padding: 7px 8px; font-size: calc(9px + 4px); }
    .metric-grid { gap: 9px; }
    .metric-card { min-height: 100px; padding: 13px; }
    .metric-card strong { font-size: calc(20px + 4px); }
    .filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .workspace-footer { flex-direction: column; }
}
@media (max-width: 460px) {
    .topbar-title .eyebrow { display: none; }
    .topbar-title strong { font-size: calc(12px + 4px); }
    .metric-card > span { font-size: calc(9px + 4px); }
    .metric-card strong { font-size: calc(18px + 4px); }
    .filter-grid { grid-template-columns: 1fr; }
    .program-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
    .program-card-content { padding: 8px 7px 4px; }
    .program-card h2 { font-size: calc(10px + 4px); }
    .program-card p { font-size: calc(8px + 4px); }
    .program-open { margin: 6px 7px 7px; padding: 6px 7px; font-size: calc(8px + 4px); }
    .inline-form { align-items: stretch; flex-direction: column; }
    .inline-form .button { width: 100%; }
    .result-grid { grid-template-columns: 1fr 1fr; }
    .frequency-list { grid-template-columns: repeat(5, 1fr); }
    .calendar-analysis-grid { grid-template-columns: 1fr; }
    .surface-card { padding: 14px; }
    .page-intro { flex-direction: column; }
    .trend-window-filter { flex: 0 0 auto; width: 100%; }
    .page-intro > .button { align-self: flex-start; }
    .embed-shell { padding: 10px; }
}
@media print {
    body, .lottery-main { background: #fff !important; color: #16243a !important; }
    .lottery-sidebar, .topbar, .button, .icon-button, .language-button, .chart-export, .pagination, .global-error, .workspace-footer { display: none !important; }
    .workspace { max-width: none; padding: 0; }
    .view-panel { display: none !important; }
    .view-panel.is-visible { display: block !important; }
    .surface-card, .metric-card { box-shadow: none; break-inside: avoid; }
}