/* Local, authored learning demo; shares MindCoda's existing theme tokens. */
.demo-experience-tabs { display:flex;gap:6px;max-width:450px;padding:5px;border:1px solid var(--mc-line);border-radius:18px;margin:0 0 24px;background:var(--mc-glass-subtle); }
.demo-experience-tabs button { flex:1;min-height:48px;padding:10px 18px;border:0;border-radius:13px;background:transparent;color:var(--mc-ink-secondary);font:inherit;font-weight:700;cursor:pointer; }
.demo-experience-tabs [aria-selected="true"] { background:var(--mc-glass-strong);color:var(--mc-ink);box-shadow:var(--mc-shadow-subtle); }
.learning-demo { --ld-accent:var(--mc-teal);border:1px solid var(--mc-line);border-radius:28px;padding:clamp(18px,3.2vw,36px);background:var(--mc-glass-subtle);box-shadow:var(--mc-shadow-elevated); }
.learning-demo [hidden], [data-plan-demo-panel][hidden] { display:none!important; }
.learning-demo button, .learning-demo input, .learning-demo textarea { font:inherit; }
.learning-demo button { cursor:pointer; }
.learning-demo :is(button,input,textarea,summary,[role="button"]):focus-visible { outline:3px solid var(--mc-teal);outline-offset:4px; }
.ld-header { display:flex;justify-content:space-between;gap:20px;align-items:start;flex-wrap:wrap; }
.ld-header h3 { font-size:clamp(1.5rem,3.2vw,2.1rem);letter-spacing:-.035em;margin:7px 0 10px;line-height:1.2; }
.ld-badge { border:1px solid var(--mc-line);border-radius:99px;padding:7px 11px;color:var(--mc-ink-secondary);font-size:.72rem;white-space:nowrap; }
.ld-courses,.ld-map-actions,.ld-topic-actions { display:flex;gap:8px;flex-wrap:wrap; }
.ld-courses { margin:18px 0 20px; }
.learning-demo :is(.ld-courses,.ld-map-actions,.ld-topic-actions) button { min-height:42px;padding:9px 14px;border:1px solid var(--mc-line);border-radius:12px;background:var(--mc-glass-standard);color:var(--mc-ink);font-weight:650; }
.ld-courses button[aria-pressed="true"] { border-color:var(--mc-teal);box-shadow:inset 0 0 0 1px var(--mc-teal); }
.ld-source { margin:0 0 22px;border:1px solid var(--mc-line);border-radius:16px;background:var(--mc-glass-standard); }
.ld-source summary { padding:14px 16px;font-size:.875rem;font-weight:650;cursor:pointer; }
.ld-source p { margin:0;padding:0 16px 18px;max-width:85ch;font-size:.9rem;line-height:1.75;color:var(--mc-ink-secondary); }
.ld-intro { display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center;padding:24px 0; }
.ld-intro h4 { font-size:clamp(1.8rem,4vw,2.8rem);line-height:1.1;letter-spacing:-.04em;margin:0 0 18px; }
.ld-intro p { color:var(--mc-ink-secondary);line-height:1.7;max-width:39ch;margin:0 0 22px; }
.ld-seed { min-height:215px;display:grid;place-items:center;position:relative;border-radius:24px;overflow:hidden;background:radial-gradient(ellipse,rgba(115,166,236,.17),transparent 65%); }
.ld-seed-ring { position:absolute;border:1px solid var(--mc-line-strong);width:230px;height:160px;border-radius:50%;transform:rotate(-24deg); }
.ld-seed-ring+ .ld-seed-ring { transform:rotate(34deg);width:175px;height:210px; }
.ld-seed-note { position:relative;transform:rotate(-5deg);width:175px;padding:24px;border:1px solid var(--mc-line-strong);border-radius:18px;background:var(--mc-glass-strong);box-shadow:var(--mc-shadow-elevated); }
.ld-seed-note strong { font-size:1rem;display:block;margin-bottom:14px; }
.ld-seed-note i { display:block;height:5px;border-radius:8px;background:var(--mc-line-strong);margin:10px 0; }.ld-seed-note i:last-child { width:65%;background:var(--mc-teal);opacity:.6; }
.ld-workspace { outline:none; }
.ld-workspace-head { display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:16px; }
.ld-opened { font-size:.8rem;color:var(--mc-ink-secondary); }
.ld-grid { display:grid;grid-template-columns:minmax(0,1.45fr) minmax(260px,1fr);gap:22px;align-items:start; }
.ld-map { background:#0b1530;border:1px solid rgba(163,190,255,.2);border-radius:22px;overflow:hidden;position:relative; }
.ld-map-label { color:#bdcbe5;font-size:.68rem;letter-spacing:.16em;font-weight:700;padding:18px 20px 0; }
.ld-map svg { display:block;width:100%;height:360px;touch-action:pan-y;user-select:none; }
.ld-map svg text { stroke:none; }
.ld-orbit { fill:none;stroke:#7a99da;stroke-width:1;opacity:.13; }.ld-orbit--inner { stroke-dasharray:3 6;opacity:.19; }
.ld-edge { stroke:#6c8ccf;stroke-width:1.2;opacity:.45;transition:stroke .2s,opacity .2s; }.ld-edge.is-selected { stroke:#a6edda;stroke-width:2;opacity:1;stroke-dasharray:5 5; }
.ld-hub circle { fill:#3769cd;stroke:#96b7ff;stroke-width:1.5; }.ld-hub text { fill:#e1eaff;font-size:13px;font-weight:700; }
.ld-node { cursor:pointer; }.ld-node circle { fill:#233b6a;stroke:#7697db;stroke-width:1.4; }.ld-node text { fill:#dae6ff;font-size:13px;font-weight:600; }
.ld-node-check { fill:#c7f5e3!important;font-size:15px!important; }
.ld-node:is(:hover,:focus-visible,.is-selected) circle { fill:#436ec1;stroke:#b6f2df;stroke-width:2.5;filter:drop-shadow(0 0 8px #7db7e366); }
.ld-node.is-selected text { fill:#c7f5e3; }
.ld-camera { display:flex;justify-content:space-between;align-items:center;gap:10px;padding:0 14px 15px; }
.ld-camera span { color:#a9b9d7;font-size:.7rem; }.ld-camera div { display:flex;gap:6px; }.ld-camera button { min-width:38px;min-height:38px;border:1px solid #46618d;border-radius:10px;background:#172744;color:#dce8ff;font-size:1rem; }
.ld-topic-list { display:flex;gap:7px;flex-wrap:wrap;margin-top:12px; }
.ld-topic-list button { min-height:38px;border:1px solid var(--mc-line);border-radius:99px;padding:7px 11px;background:var(--mc-glass-standard);color:var(--mc-ink-secondary);font-size:.76rem; }
.ld-topic-list [aria-pressed="true"] { color:var(--mc-ink);border-color:var(--mc-teal); }
.ld-detail,.ld-editor,.ld-pick { padding:23px;border:1px solid var(--mc-line);border-radius:22px;background:var(--mc-glass-standard); }
.ld-detail h4,.ld-editor h4 { font-size:1.5rem;margin:9px 0 14px;letter-spacing:-.03em; }
.ld-detail>p { color:var(--mc-ink-secondary);line-height:1.7;font-size:.95rem; }
.ld-topic-actions { margin:20px 0 0; }.ld-topic-actions button { font-size:.8rem; }
.ld-topic-actions button:last-child { color:var(--mc-ink-secondary); }
.ld-recall { border-top:1px solid var(--mc-line);margin-top:23px;padding-top:20px; }
.ld-recall h5 { font-size:1rem;line-height:1.5;margin:10px 0 15px; }.ld-recall .eyebrow { font-size:.65rem; }
.ld-answers { display:grid;gap:9px; }.ld-answers button { text-align:left;padding:12px 13px;min-height:48px;border:1px solid var(--mc-line);border-radius:12px;background:var(--mc-glass-subtle);color:var(--mc-ink);font-size:.85rem;line-height:1.5; }
.ld-answers [aria-pressed="true"] { border-color:var(--mc-teal);background:var(--mc-marketing-selected); }
.ld-feedback { margin-top:15px;padding:16px;border-radius:14px;border:1px solid var(--mc-line-strong);background:var(--mc-marketing-selected); }.ld-feedback strong { font-size:.9rem; }.ld-feedback p { color:var(--mc-ink-secondary);font-size:.85rem;line-height:1.6;margin:8px 0 0; }
.ld-summary { margin-top:22px;padding:21px 24px;border-radius:20px;border:1px solid var(--mc-line);background:var(--mc-glass-standard); }.ld-summary h4 { font-size:1rem;margin:0 0 12px; }.ld-summary p { font-size:.88rem;line-height:1.85;color:var(--mc-ink-secondary);margin:0; }
.ld-status { min-height:1.6em;font-size:.8rem;color:var(--mc-teal);margin:16px 0 8px; }.ld-footnote { font-size:.75rem!important;line-height:1.7;color:var(--mc-ink-secondary);margin-bottom:0;max-width:85ch; }
.ld-editor label { display:block;font-size:.85rem;margin:14px 0 7px;font-weight:650; }.ld-editor :is(input,textarea),.ld-recall textarea { width:100%;box-sizing:border-box;padding:12px;border:1px solid var(--mc-line-strong);border-radius:12px;background:var(--mc-glass-subtle);color:var(--mc-ink); }
.ld-editor textarea { min-height:130px;resize:vertical; }.ld-edit-error { color:var(--mc-danger);font-size:.8rem;line-height:1.5; }
.ld-arrived .ld-map { animation:ld-reveal .5s ease-out; }@keyframes ld-reveal { from { opacity:0;transform:translateY(8px) scale(.985); }to { opacity:1;transform:none; } }
@media(max-width:800px){.ld-grid{grid-template-columns:1fr}.ld-intro{gap:18px}.ld-detail,.ld-editor,.ld-pick{padding:20px}.ld-map svg{height:360px}}
@media(max-width:500px){.learning-demo{padding:18px;border-radius:22px}.ld-header{gap:8px}.ld-header h3{font-size:1.5rem}.ld-badge{font-size:.65rem}.ld-intro{grid-template-columns:1fr;padding:4px 0 18px}.ld-seed{min-height:170px;order:2}.ld-seed-note{width:150px;padding:20px}.ld-seed-ring{width:215px;height:125px}.ld-seed-ring+.ld-seed-ring{height:165px}.ld-intro h4{font-size:2rem}.ld-courses button{padding:9px 12px;font-size:.8rem}.ld-map-actions button{font-size:.75rem;padding:9px 11px}.ld-camera{padding-inline:10px}.ld-camera span{max-width:110px;line-height:1.5}.ld-summary{padding:18px}.demo-experience-tabs button{padding:9px 12px;font-size:.85rem}.ld-map svg{height:360px}.ld-topic-list button{min-height:42px}.ld-node text{font-size:12px}}
@media(prefers-reduced-motion:reduce){.learning-demo *{animation:none!important;transition:none!important}}
