/* C031: reuses the approved interface's palette, cards and typography. */
.learning-page{max-width:1200px;margin:0 auto}.learning-page>nav{margin-bottom:1.25rem}
.learning-page>.card{margin-block:1.4rem}.learning-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:1rem}
.learning-card{padding:1.1rem;border:1px solid var(--line,#33444d);border-radius:12px;background:rgba(9,18,24,.7);overflow-wrap:anywhere}
.learning-card h3{font-size:1.06rem;margin-top:0}.learning-card .primary{margin-top:.85rem}
.learning-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.8rem}.learning-state{font-size:.78rem;border:1px solid currentColor;border-radius:999px;padding:.18rem .6rem;white-space:nowrap}
.learning-search{display:flex;align-items:center;flex-wrap:wrap;gap:.7rem;margin-block:1.2rem}.learning-search input{flex:1;min-width:160px}.learning-search select{max-width:100%}
.learning-history-toggle{display:inline-flex;align-items:center;gap:.55rem}.learning-topic-save .button-row{align-items:stretch;flex-direction:column}
.learning-page [data-learning-notice]:empty,.learning-topic-save [data-learning-notice]:empty{display:none}
.learning-page :focus-visible,.learning-topic-save :focus-visible{outline:3px solid var(--accent,#d3bd84);outline-offset:3px}
@media(max-width:700px){.learning-search{align-items:stretch;flex-direction:column}.learning-card-head{flex-wrap:wrap}.learning-page>.card{padding:1rem}.learning-search button{width:100%}}

.learning-search input,.learning-search select{min-height:44px;padding:.55rem .7rem;font:inherit;color:var(--text,#e5eef1);background:#101d25;border:1px solid var(--line,#3b515f);border-radius:8px}