.learning-surface{--lp-bg:#fffdf7;--lp-card:#fff;--lp-fg:#183b38;--lp-muted:#48645f;--lp-line:#c4d5ce;--lp-accent:#176b58;color:var(--lp-fg);background:var(--lp-bg);font:16px/1.55 system-ui,sans-serif;overflow-wrap:anywhere;color-scheme:light}
.learning-surface[data-theme=dark]{--lp-bg:#142b2b;--lp-card:#203b3a;--lp-fg:#f2f6ed;--lp-muted:#bed0c8;--lp-line:#496763;--lp-accent:#8bd8bd;color-scheme:dark}
.learning-surface *{box-sizing:border-box}.learning-surface [hidden]{display:none!important}.learning-surface main,.learning-surface>header{max-width:1040px;margin:auto;padding:24px 20px}.learning-surface h1{font-size:clamp(1.8rem,5vw,2.8rem);line-height:1.16;letter-spacing:-.035em}.learning-surface h2{font-size:1.35rem}.learning-surface h3{font-size:1.1rem;margin:.3em 0}.learning-surface p{color:var(--lp-muted)}.learning-surface a{color:var(--lp-accent);text-underline-offset:4px}.learning-surface nav{display:flex;flex-wrap:wrap;gap:12px 20px}.learning-surface section,.learning-surface article,.learning-surface details{padding:20px;margin:18px 0;border:1px solid var(--lp-line);border-radius:16px;background:var(--lp-card)}.learning-surface label{display:block;margin:12px 0;font-weight:600}.learning-surface input,.learning-surface select,.learning-surface textarea,.learning-surface button{font:inherit;max-width:100%;min-height:44px;border:1px solid var(--lp-line);border-radius:9px;padding:9px 12px;background:var(--lp-card);color:var(--lp-fg)}.learning-surface input:not([type=checkbox]),.learning-surface select,.learning-surface textarea{display:block;width:100%;margin-top:5px}.learning-surface input[type=checkbox]{min-height:0;width:20px;height:20px;vertical-align:middle}.learning-surface button{cursor:pointer;margin:4px 8px 4px 0;font-weight:650;white-space:normal}.learning-surface button[type=submit]{background:var(--lp-accent);color:var(--lp-bg)}.learning-surface button:disabled{opacity:.5;cursor:default}.learning-surface :focus-visible{outline:3px solid #df930f;outline-offset:3px}.learning-surface .learning-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:12px}.learning-surface [role=status]{min-height:1.5em}.learning-surface .learning-resource{padding:14px}.learning-surface .learning-context{border-inline-start:5px solid var(--lp-accent)}.learning-surface summary{cursor:pointer;font-weight:700}.learning-surface .learning-banner{font-size:.9rem;letter-spacing:.08em;text-transform:uppercase;color:var(--lp-muted)}