.lh-dashboard { display: grid; gap: 28px; width: 100%; color: var(--text, currentColor); }
.lh-header { display: grid; grid-template-columns: minmax(0, 1fr) 230px; gap: 40px; align-items: end; padding-bottom: 30px; border-bottom: 1px solid color-mix(in srgb, currentColor 14%, transparent); }
.lh-eyebrow, .lh-panel-head span, .lh-review-panel > span { margin: 0 0 10px; color: var(--accent, #c84d24); font: 700 12px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .12em; }
.lh-header h1 { margin: 0; font-size: clamp(38px, 5vw, 68px); line-height: .98; letter-spacing: -.055em; }
.lh-header p { max-width: 760px; margin: 18px 0 0; color: color-mix(in srgb, currentColor 70%, transparent); font-size: 17px; line-height: 1.7; }
.lh-data-status { display: grid; gap: 4px; padding: 18px; border: 1px solid color-mix(in srgb, currentColor 14%, transparent); }
.lh-data-status span, .lh-data-status small { color: color-mix(in srgb, currentColor 60%, transparent); font-size: 12px; }
.lh-data-status strong { font-size: 20px; }
.lh-metrics { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); border: 1px solid color-mix(in srgb, currentColor 14%, transparent); }
.lh-metrics > div { display: grid; gap: 7px; min-height: 112px; padding: 20px; border-right: 1px solid color-mix(in srgb, currentColor 14%, transparent); }
.lh-metrics > div:last-child { border-right: 0; }
.lh-metrics strong { font: 650 clamp(24px, 3vw, 36px)/1 ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--accent, #c84d24); }
.lh-metrics span { color: color-mix(in srgb, currentColor 62%, transparent); font-size: 12px; line-height: 1.4; }
.lh-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(230px, .75fr); gap: 18px; }
.lh-panel { padding: 24px; border: 1px solid color-mix(in srgb, currentColor 14%, transparent); background: color-mix(in srgb, currentColor 2%, transparent); }
.lh-panel-head { display: flex; justify-content: space-between; gap: 18px; align-items: end; }
.lh-panel-head h2 { margin: 0; font-size: 24px; }
.lh-panel-head > strong { color: color-mix(in srgb, currentColor 60%, transparent); font-size: 13px; }
.lh-chart { display: grid; grid-template-columns: repeat(14, minmax(12px, 1fr)); gap: 8px; height: 190px; margin-top: 28px; }
.lh-bar-column { display: grid; grid-template-rows: 18px 1fr 18px; gap: 5px; min-width: 0; text-align: center; }
.lh-bar-value, .lh-bar-column small { color: color-mix(in srgb, currentColor 52%, transparent); font: 10px/1 ui-monospace, SFMono-Regular, Menlo, monospace; }
.lh-bar { position: relative; display: block; border-bottom: 1px solid color-mix(in srgb, currentColor 16%, transparent); }
.lh-bar i { position: absolute; inset: auto 20% 0; min-height: 2px; background: var(--accent, #c84d24); }
.lh-review-panel { display: flex; flex-direction: column; justify-content: center; }
.lh-review-panel > strong { color: var(--accent, #c84d24); font: 650 64px/1 ui-monospace, SFMono-Regular, Menlo, monospace; }
.lh-review-panel p { margin: 10px 0; font-size: 17px; }
.lh-review-panel small { color: color-mix(in srgb, currentColor 60%, transparent); line-height: 1.6; }
.lh-session-list { display: grid; margin-top: 16px; }
.lh-session { border-top: 1px solid color-mix(in srgb, currentColor 12%, transparent); }
.lh-session summary { display: grid; grid-template-columns: minmax(0, 1fr) auto 20px; gap: 24px; align-items: center; min-height: 78px; padding: 14px 4px; cursor: pointer; list-style: none; }
.lh-session summary::-webkit-details-marker { display: none; }
.lh-session summary > div { display: grid; gap: 5px; }
.lh-session span { color: color-mix(in srgb, currentColor 58%, transparent); font-size: 12px; }
.lh-session-result { text-align: right; }
.lh-session-result strong { color: var(--accent, #c84d24); font: 650 20px/1 ui-monospace, SFMono-Regular, Menlo, monospace; }
.lh-session-toggle { font-size: 18px !important; transition: transform .2s ease; }
.lh-session[open] .lh-session-toggle { transform: rotate(180deg); }
.lh-answer-list { display: grid; padding: 0 4px 18px 24px; }
.lh-answer { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 13px 0; border-top: 1px solid color-mix(in srgb, currentColor 9%, transparent); }
.lh-answer-index { display: grid; place-items: center; width: 26px; height: 26px; background: color-mix(in srgb, currentColor 6%, transparent); font: 650 11px/1 ui-monospace, SFMono-Regular, Menlo, monospace; }
.lh-answer > div { display: grid; gap: 5px; min-width: 0; }
.lh-answer > div strong { overflow-wrap: anywhere; font-size: 13px; font-weight: 600; }
.lh-answer small { color: color-mix(in srgb, currentColor 58%, transparent); font-size: 11px; overflow-wrap: anywhere; }
.lh-answer-state { display: grid; gap: 3px; min-width: 46px; color: #b94035 !important; font-weight: 700; text-align: right; }
.lh-answer-state small { font-weight: 400; }
.lh-answer.is-correct .lh-answer-state { color: #24734b !important; }
.lh-empty { padding: 24px 0; color: color-mix(in srgb, currentColor 65%, transparent); }
.lh-data-tools { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 22px 24px; border: 1px solid color-mix(in srgb, currentColor 14%, transparent); }
.lh-data-tools p { margin: 5px 0 0; color: color-mix(in srgb, currentColor 60%, transparent); font-size: 13px; }
.lh-tool-actions { display: flex; gap: 10px; }
.lh-tool-actions button { min-height: 44px; padding: 0 18px; border: 1px solid var(--accent, #c84d24); background: transparent; color: inherit; cursor: pointer; }
.lh-tool-actions button:first-child { background: var(--accent, #c84d24); color: #fff; }
.lh-message { grid-column: 1 / -1; color: var(--accent, #c84d24) !important; }
.lh-loading, .lh-error { padding: 48px 0; }
@media (max-width: 1050px) { .lh-metrics { grid-template-columns: repeat(3, 1fr); } .lh-metrics > div:nth-child(3) { border-right: 0; } .lh-metrics > div:nth-child(-n+3) { border-bottom: 1px solid color-mix(in srgb, currentColor 14%, transparent); } }
@media (max-width: 720px) { .lh-header, .lh-grid, .lh-data-tools { grid-template-columns: 1fr; } .lh-data-status { max-width: 280px; } .lh-chart { gap: 3px; } .lh-bar-column small { font-size: 8px; } }
@media (max-width: 520px) { .lh-metrics { grid-template-columns: repeat(2, 1fr); } .lh-metrics > div:nth-child(2n) { border-right: 0; } .lh-metrics > div:nth-child(3) { border-right: 1px solid color-mix(in srgb, currentColor 14%, transparent); } .lh-metrics > div:nth-child(-n+4) { border-bottom: 1px solid color-mix(in srgb, currentColor 14%, transparent); } .lh-session summary { grid-template-columns: 1fr 18px; gap: 10px; } .lh-session-result { grid-column: 1; text-align: left; } .lh-session-toggle { grid-column: 2; grid-row: 1 / span 2; } .lh-answer-list { padding-left: 0; } .lh-answer { grid-template-columns: 26px minmax(0, 1fr); } .lh-answer-state { grid-column: 2; justify-self: start; display: flex; gap: 8px; text-align: left; } .lh-tool-actions { display: grid; grid-template-columns: 1fr 1fr; } }