/* Option A UI, using the shared palette and control primitives. */
body.user-v1-focus-page .learning-hub{background:var(--ui-panel);border:1px solid var(--ui-line);border-radius:var(--vui-radius-tile);padding:12px;margin-bottom:12px;color:var(--ui-text);text-align:left}
.learning-hub strong{font-size:16px}.learning-hub p{font-size:13px;margin:6px 0 10px;color:var(--ui-muted)}
body.user-v1-focus-page .la-actions{display:flex;gap:8px;flex-wrap:wrap}
body.user-v1-focus-page .la-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 12px;border:1px solid var(--ui-line);border-radius:var(--vui-radius-control);background:var(--ui-panel);color:var(--ui-text);font:inherit;font-size:14px;line-height:1.4;cursor:pointer;white-space:normal;overflow-wrap:anywhere;touch-action:manipulation}
body.user-v1-focus-page .la-button .focus-glyph{font-size:20px;flex-shrink:0}
body.user-v1-focus-page .la-primary{background:var(--ui-primary);border-color:var(--ui-primary);color:var(--ui-primary-ink);font-weight:750}
body.user-v1-focus-page .la-button[aria-pressed=true]{border:2px solid var(--ui-accent)}
body.user-v1-focus-page .learning-dialog{width:min(680px,calc(100vw - 24px));max-height:calc(100vh - 24px);max-height:calc(100svh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding:18px;border:1px solid var(--ui-line);border-radius:18px;background:var(--ui-panel);color:var(--ui-text);font:16px/1.5 system-ui;overflow:auto;overscroll-behavior:contain}
.learning-dialog::backdrop{background:#080c18b3}.la-dialog-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.la-dialog-head h2{font-size:22px;margin:0}.la-dialog-head .la-button{flex-shrink:0}
.la-status:empty{display:none}.la-status,.la-notice{padding:10px;border:1px solid var(--ui-line);background:var(--ui-soft);border-radius:10px}
.la-body{display:flex;flex-direction:column;gap:12px}.la-body h3{font-size:18px;margin:0 0 8px}.la-body p{margin:6px 0}.la-meta{font-size:13px;color:var(--ui-muted)}
.la-body progress{width:100%;height:10px;accent-color:var(--ui-accent)}.la-study-card{padding:20px;border:2px solid var(--ui-primary);border-radius:18px;background:var(--ui-card);text-align:center}
.la-sentence{font-size:clamp(22px,5vw,32px);font-weight:750;overflow-wrap:anywhere}.la-translation{color:var(--ui-note)}.la-choices{display:grid;gap:10px;margin:18px 0}.la-choices .la-button{text-align:left;justify-content:flex-start;font-size:16px}
.la-section{padding:14px;border:1px solid var(--ui-line);border-radius:13px}.la-section ul{padding-left:20px}.la-section li{padding:6px 0;overflow-wrap:anywhere}
.la-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.la-metrics>div{padding:14px;border:1px solid var(--ui-line);border-radius:13px;background:var(--ui-soft)}.la-metrics strong,.la-metrics span{display:block}.la-metrics strong{font-size:22px}.la-metrics span{font-size:14px}
.la-body label{display:block;margin:8px 0}.la-body input,.la-body select,.la-body textarea{width:100%;min-height:44px;font:16px/1.5 system-ui;padding:8px;border:1px solid var(--ui-line);border-radius:10px;background:var(--ui-panel);color:var(--ui-text);box-sizing:border-box}.la-body textarea{resize:vertical}
.la-table{overflow-x:auto}.la-table table{width:100%;border-collapse:collapse;font-size:14px}.la-table th,.la-table td{padding:8px;border-bottom:1px solid var(--ui-line);text-align:left}.la-confirm{padding:12px;background:var(--ui-soft);margin-top:12px;border:1px solid var(--ui-accent);border-radius:10px}
.learning-dialog :focus-visible{outline:3px solid var(--ui-focus);outline-offset:3px}
@media(max-width:380px){.learning-hub .la-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.la-metrics{grid-template-columns:1fr}.la-study-card{padding:12px}}
@media(orientation:landscape) and (max-height:500px){body.user-v1-focus-page .learning-dialog{padding:12px}.la-choices{grid-template-columns:repeat(2,minmax(0,1fr))}}