/* Four quadrant hues carry both the matrix and the point chart. */
html body.luyen-app #matrix-container .matrix-column-container {
  background:color-mix(in srgb,var(--quadrant) 7%,var(--ai-surface))!important;
  border-color:color-mix(in srgb,var(--quadrant) 22%,var(--ai-line))!important;
}
html.dark body.luyen-app #matrix-container .matrix-column-container { background:color-mix(in srgb,var(--quadrant) 12%,var(--ai-surface))!important; }
html body.luyen-app #matrix-container .matrix-column-container>header,
html body.luyen-app #matrix-container .matrix-column-container>.column-body { background:transparent!important; }
html body.luyen-app #matrix-container .matrix-column-container.drag-over-active { background:color-mix(in srgb,var(--quadrant) 19%,var(--ai-surface))!important; outline:3px solid var(--quadrant); outline-offset:-3px; }
html body.luyen-app #matrix-container .task-card-item.is-done .task-title { text-decoration:line-through!important; text-decoration-thickness:1.5px!important; text-decoration-color:var(--ai-muted)!important; color:var(--ai-muted)!important; }
.task-drag-handle { cursor:grab!important; touch-action:none!important; font-size:21px!important; color:var(--ai-muted); user-select:none; }
.task-drag-handle:active { cursor:grabbing!important; }
body.is-dragging .task-card-item { pointer-events:auto!important; }
body.luyen-app .floating-dopamine-bubble { pointer-events:none; }
body.luyen-app .floating-dopamine-bubble button { pointer-events:auto; }
.touch-drag-ghost { position:fixed; z-index:1000; max-width:250px; padding:12px 16px; border:2px solid var(--ai-brand); border-radius:8px; color:var(--ai-ink); background:var(--ai-surface); box-shadow:0 6px 20px #0003; pointer-events:none; }
.task-score { display:block; color:var(--ai-muted); font-size:11px; padding:4px 0; }
.task-reference { display:block; font-size:11px; color:var(--ai-brand); margin:4px 0; }
html body.luyen-app #matrix-container .task-card-item.task-highlight { outline:3px solid var(--ai-brand); outline-offset:3px; animation:task-arrival 1.1s ease-out 2; }
@keyframes task-arrival { 0%,100% { box-shadow:0 0 0 4px color-mix(in srgb,var(--ai-brand) 12%,transparent); } 45% { box-shadow:0 0 0 9px color-mix(in srgb,var(--ai-brand) 22%,transparent); } }
.points-panel { display:grid; grid-template-columns:minmax(170px,.7fr) minmax(0,2fr); gap:12px 28px; margin:0 0 20px; padding:16px 20px 0; background:var(--ai-surface); border:1px solid var(--ai-line); border-radius:12px; }
.points-overview h2 { font-size:14px; font-weight:600; color:var(--ai-muted); }
.points-total { display:flex; align-items:baseline; gap:8px; position:relative; flex-wrap:wrap; }
.points-total strong { font-size:37px; line-height:1.25; letter-spacing:-1px; color:var(--ai-brand); font-variant-numeric:tabular-nums; }
.points-total span { color:var(--ai-muted); font-size:12px; }
.points-overview p { display:flex; flex-direction:column; color:var(--ai-success); font-size:12px; }
.points-deduction { color:var(--ai-muted); }
.points-gain { color:var(--ai-success); font-size:19px; }
.points-chart { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 24px; }
.points-group { text-align:left; padding:4px 0; min-width:0; border-radius:4px; }
.points-group-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:13px; color:var(--ai-ink); }
.points-group-heading>span { display:flex; align-items:center; gap:6px; }
.points-group small { display:block; font-size:10px; color:var(--ai-muted); margin-top:4px; }
.points-track { display:block; margin-top:5px; height:12px; background:color-mix(in srgb,var(--quadrant) 10%,var(--ai-soft)); border-radius:5px; overflow:hidden; }
.points-track>span { display:block; height:100%; background:var(--quadrant); min-width:0; border-radius:5px; transition:width .3s ease; }
.points-track i { display:block; height:100%; background:#ffffff60; }
.points-rules { grid-column:1/-1; border-top:1px solid var(--ai-line); font-size:12px; color:var(--ai-muted); }
.points-rules summary { display:flex; align-items:center; }
.points-rules p { max-width:90ch; margin:0 0 10px; }
.points-rules button { color:var(--ai-brand); text-decoration:underline; }
.points-boost .points-total strong { animation:points-pop .5s ease-out; }
@keyframes points-pop { 40% { transform:scale(1.12); } }
@media(max-width:600px) {
 .points-panel { grid-template-columns:1fr; padding:12px 12px 0; gap:8px; margin-bottom:16px; }
 .points-overview { display:grid; grid-template-columns:1fr auto; gap:0 12px; align-items:center; }
 .points-overview h2 { font-size:12px; }
 .points-total { grid-column:2; grid-row:1/3; gap:4px; flex-direction:column; align-items:flex-end; }
 .points-total strong { font-size:29px; }
 .points-total span { font-size:10px; }
 .points-gain { position:absolute; right:0; top:-18px; font-size:13px; }
 .points-overview p { font-size:10px; }
 .points-chart { gap:4px 14px; }
 .points-group-heading { font-size:12px; }
 .points-group small { font-size:9px; }
 .points-track { height:8px; }
 .points-rules { font-size:11px; }
}
.points-period { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; color:var(--ai-muted); font-size:12px; }
body.is-dragging,body.is-dragging * { cursor:grabbing!important; }
.past-matrix .task-card-item { cursor:default; }
.past-day-note { font-size:13px; color:var(--ai-muted); margin:8px 0; }
.luyen-app button:disabled,.luyen-app input:disabled,.luyen-app select:disabled { opacity:.5; cursor:not-allowed; }
.points-panel { grid-template-columns:minmax(150px,.7fr) minmax(0,2fr) minmax(150px,.75fr); }
.matrix-statistics { border-left:1px solid var(--ai-line); padding-left:18px; font-size:12px; min-width:0; }
.matrix-statistics h3 { font-size:14px; font-weight:600; }
.matrix-statistics p { color:var(--ai-muted); margin:4px 0; }
.matrix-statistics>strong { font-size:20px; }
.matrix-statistics dl>div { display:flex; justify-content:space-between; gap:12px; margin-top:4px; }
.matrix-statistics dd { font-weight:600; }
.history-date-picker { display:flex; flex-direction:column; gap:4px; font-size:12px; color:var(--ai-muted); }
.history-date-picker input { min-height:44px; padding:6px 8px; background:var(--ai-surface); border:1px solid var(--ai-line); border-radius:8px; color:var(--ai-ink); max-width:100%; }
.learner-heading { flex-wrap:wrap; }
.danger-button { color:#b42318!important; }
#relation-pair { white-space:pre-wrap; overflow-wrap:anywhere; margin-bottom:16px; }
@media(max-width:900px) { .points-panel { grid-template-columns:minmax(0,1fr) minmax(0,2fr); } .matrix-statistics { grid-column:1/-1; border-left:0; border-top:1px solid var(--ai-line); padding:12px 0; } .matrix-statistics dl { display:flex; gap:20px; flex-wrap:wrap; } }
@media(max-width:600px) { .points-panel { grid-template-columns:1fr; } .matrix-statistics dl { gap:12px; } .history-date-picker { flex-direction:row; align-items:center; } }
.task-card-notes { margin:6px 0 10px; color:var(--ai-muted); font-size:13px; line-height:1.55; white-space:pre-wrap; overflow-wrap:anywhere; user-select:text; }
.planning-sidebar { grid-template-columns:repeat(2,minmax(0,1fr)); }
.learner-heading h1 { font-size:clamp(22px,2.4vw,30px); line-height:1.25; overflow-wrap:anywhere; }
@media(max-width:600px) { .planning-sidebar { grid-template-columns:1fr; } .task-card-notes { font-size:14px; } .learner-heading { align-items:flex-start; } }
.points-scopes { display:flex; gap:4px; padding:3px; border-radius:10px; background:var(--ai-soft); }
.points-scopes button { padding:0 14px; border-radius:7px; font-size:13px; font-weight:600; }
.points-scopes button[aria-pressed="true"] { background:var(--ai-brand); color:white; }
@media(prefers-reduced-motion:reduce) { .points-boost .points-total strong,.task-highlight { animation:none!important; } .points-track>span { transition:none; } }

/* Keep the daily summary to one row; reveal supporting detail on demand. */
html body.luyen-app img.brand-logo-icon { background:#fff!important; object-fit:contain; padding:2px; border-radius:8px; }
.luyen-app #learner-home { padding-top:10px; }
.luyen-app .learner-heading { margin-bottom:8px; }
.luyen-app .points-panel { display:block; position:relative; padding:0 12px; margin-bottom:4px; }
.points-strip { display:flex; align-items:center; gap:16px; min-height:52px; margin-right:82px; overflow-x:auto; white-space:nowrap; font-size:12px; scrollbar-width:thin; }
.points-strip>* { flex-shrink:0; }
.points-strip .points-scopes { padding:2px; }
.points-strip .points-scopes button { min-height:32px; padding:0 10px; }
.points-strip .points-total { flex-direction:row; align-items:baseline; flex-wrap:nowrap; gap:6px; }
.points-strip .points-total strong { font-size:22px; letter-spacing:-.5px; }
.points-strip .points-total span { font-size:12px; }
.points-strip .points-gain { position:static; font-size:12px; }
.points-earned { color:var(--ai-success); }
.points-range { color:var(--ai-muted); }
.points-panel .points-rules { border:0; }
.points-panel .points-rules>summary { position:absolute; top:4px; right:12px; min-height:44px; gap:6px; color:var(--ai-brand); cursor:pointer; font-size:12px; }
.points-panel .points-rules>summary::after { content:'+'; font-size:18px; }
.points-panel .points-rules[open]>summary::after { content:'−'; }
.points-details { display:grid; grid-template-columns:minmax(0,2fr) minmax(180px,1fr); gap:16px 24px; padding:16px 0; border-top:1px solid var(--ai-line); }
.points-details .points-chart { grid-column:1; grid-row:1; }
.points-details .points-group { text-decoration:none; }
.points-details .matrix-statistics { grid-column:2; grid-row:1; border-top:0; border-left:1px solid var(--ai-line); padding:0 0 0 18px; }
.points-details .matrix-statistics dl { display:block; }
.points-explanation { grid-column:1/-1; }
.points-explanation h2 { font-size:13px; font-weight:600; color:var(--ai-ink); margin-bottom:8px; }
@media(max-width:600px) {
 .points-strip { gap:12px; }
 .points-details { grid-template-columns:minmax(0,1fr); }
 .points-details .matrix-statistics { grid-column:1; grid-row:2; border-left:0; border-top:1px solid var(--ai-line); padding:12px 0 0; }
}

/* Compact daily workspace: spend vertical space on the work itself. */
.luyen-app .learner-heading { gap:8px 16px; }
.luyen-app .learner-heading h1 { font-size:clamp(20px,2vw,26px); }
.luyen-app .learner-heading p { margin-top:2px; font-size:13px; }
.luyen-app .history-date-picker { flex-direction:row; align-items:center; white-space:nowrap; }
.luyen-app .learner-profile,.luyen-app .learner-today { margin-left:auto; }
.luyen-app .welcome-note { padding:0 12px; margin-bottom:6px; font-size:13px; }
.welcome-note summary { display:list-item; padding:10px 0; font-weight:600; }
.welcome-note ol { margin-top:0; margin-bottom:4px; }
.luyen-app .day-workspace { padding-top:8px; padding-bottom:16px; }
.luyen-app .day-overview { margin-bottom:10px; gap:8px 16px; }
.luyen-app .day-overview h2 { font-size:20px; margin-bottom:2px; }
.luyen-app .overview-tools { gap:16px; }
.luyen-app .quick-meta { margin:0 0 4px; align-items:center; }
.luyen-app .entry-guidance { padding:4px 0; }
.luyen-app .work-filters { padding-bottom:2px; }
.luyen-app .filter-summary { min-height:30px; }
.luyen-app .daily-layout { gap:12px; }
.luyen-app #matrix-columns-grid { gap:12px; }
.luyen-app .matrix-column-container>header { min-height:64px; padding:10px 12px 8px; }
.luyen-app .matrix-column-container header p { margin-top:2px; }
.luyen-app .column-body { min-height:0; }
html body.luyen-app .matrix-empty-state { padding:12px 6px; }
.luyen-app .support-panel summary { padding:6px 0; }
@media(min-width:901px) {
 .luyen-app .day-overview>div:first-child { display:flex; align-items:baseline; gap:16px; }
 .luyen-app .day-overview h2 { margin:0; }
}
@media(hover:hover) and (pointer:fine) {
 .luyen-app #quick-help summary { min-height:28px; }
 .luyen-app .filter-summary button { min-height:30px; }
 html body.luyen-app #matrix-container .task-actions button,
 html body.luyen-app #matrix-container .task-tags button { min-height:32px; }
}
@media(max-width:600px) {
 .luyen-app .learner-heading { gap:4px 8px; }
 .luyen-app .learner-heading>div:first-child { width:100%; }
 .luyen-app .history-date-picker { font-size:12px; }
 .luyen-app .day-overview { gap:4px; }
 .luyen-app .day-overview>div:first-child { display:flex; align-items:baseline; gap:4px 10px; flex-wrap:wrap; }
 .luyen-app .day-overview h2 { font-size:18px; }
 .luyen-app .day-overview p { font-size:12px; }
 .luyen-app .quick-meta { margin-bottom:0; }
 .luyen-app .matrix-column-container>header { min-height:64px; }
}

/* Completed work stays as a single title row; details remain available by title. */
html body.luyen-app #matrix-container .task-card-item.is-done { padding:4px 10px!important; }
html body.luyen-app #matrix-container .task-card-item.is-done>:not(.task-main) { display:none; }
html body.luyen-app #matrix-container .task-card-item.is-done .task-main { align-items:center; }
html body.luyen-app #matrix-container .task-card-item.is-done .task-card-done-btn { margin:0 0 0 -10px; }
html body.luyen-app #matrix-container .task-card-item.is-done .task-title { flex:1; min-width:0; padding:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }