/* Lernplayer: gilt in der Plattform, in der Vorschau und im SCORM-Paket. Eckige Formen, Akzent aus brand.json. */
.pl{display:grid;grid-template-columns:300px 1fr;min-height:70vh;background:var(--paper);color:var(--ink);font-family:var(--font-body);font-size:17px;line-height:1.6}
.pl *{box-sizing:border-box}
.pl-nav{border-right:1px solid var(--line);padding:20px 16px;background:var(--tint);position:sticky;top:0;align-self:start;max-height:100vh;overflow:auto}
.pl-title{font-family:var(--font-head);font-weight:700;font-size:18px;line-height:1.25;margin-bottom:12px}
.pl .bar{height:6px;background:var(--line);margin:6px 0}
.pl .bar span{display:block;height:100%;background:var(--accent)}
.pl .muted{color:var(--muted)}.pl .small{font-size:13px;margin:4px 0 12px}
.pl .lang{display:flex;gap:6px;margin:0 0 14px}
.pl .steps{list-style:none;margin:0;padding:0}
.pl .step button{display:flex;gap:10px;align-items:flex-start;width:100%;text-align:left;background:none;border:0;border-left:3px solid transparent;padding:8px 8px;cursor:pointer;font:inherit;font-size:15px;color:var(--ink)}
.pl .step.topic button{padding-left:26px;font-size:14px}
.pl .step.quiz button{padding-left:26px;font-size:14px}
.pl .step button:hover:not(:disabled){background:#fff}
.pl .step.current button{background:#fff;border-left-color:var(--accent);font-weight:700}
.pl .step.locked button{color:var(--muted);cursor:not-allowed}
.pl .dot{flex:0 0 12px;height:12px;margin-top:6px;border:2px solid var(--muted);background:#fff}
.pl .step.done .dot{background:var(--accent);border-color:var(--accent)}
.pl .step.locked .dot{border-style:dashed}
.pl .tag{margin-left:auto;font-family:var(--font-head);font-size:11px;text-transform:uppercase;letter-spacing:.06em;background:#fff;border:1px solid var(--line);padding:0 6px;color:var(--muted)}
.pl-main{padding:28px 40px 56px;max-width:900px;width:100%}
.pl-main h1{font-family:var(--font-head);font-weight:700;font-size:30px;line-height:1.2;margin:0 0 18px}
.pl .crumb{margin:0 0 4px;color:var(--muted);font-family:var(--font-head);font-size:13px;text-transform:uppercase;letter-spacing:.06em}
.pl .rich p{margin:0 0 14px}.pl .rich ul,.pl .rich ol{margin:0 0 14px;padding-left:24px}
.pl .rich a{color:var(--accent);text-decoration:underline}
.pl .rich blockquote{margin:0 0 14px;padding-left:14px;border-left:3px solid var(--line);color:var(--muted)}
.pl .rich table{border-collapse:collapse;margin:0 0 14px}.pl .rich td,.pl .rich th{border:1px solid var(--line);padding:6px 10px}
.pl .blk-h{font-family:var(--font-head);font-size:22px;margin:24px 0 10px}
.pl .blk-img{margin:0 0 18px}.pl .blk-img img{max-width:100%;height:auto;display:block;border:1px solid var(--line)}
.pl .blk-img figcaption{font-size:14px;color:var(--muted);margin-top:4px}
.pl .blk-video{position:relative;padding-top:56.25%;margin:0 0 18px;background:#000}
.pl .blk-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.pl .blk-info{border-left:4px solid var(--accent);background:var(--tint);padding:12px 16px;margin:0 0 16px}
.pl .blk-info strong{display:block;font-family:var(--font-head);text-transform:uppercase;font-size:12px;letter-spacing:.06em;margin-bottom:4px}
.pl .blk-info.wichtig{border-left-color:var(--red);background:#fdeef0}
.pl .blk-info.tipp{border-left-color:#2a7f62;background:#eaf6f1}
.pl .blk-info .rich p:last-child{margin:0}
.pl .btn,.btn-pl{display:inline-block;background:var(--accent);color:#fff;border:2px solid var(--accent);padding:10px 20px;font:700 15px var(--font-head);letter-spacing:.03em;cursor:pointer;text-decoration:none;border-radius:0}
.pl .btn:hover:not(:disabled){filter:brightness(.9)}.pl .btn:disabled{opacity:.5;cursor:default}
.pl .btn-ghost{background:#fff;color:var(--ink);border-color:var(--ink)}
.pl .btn.sm{padding:3px 10px;font-size:13px}.pl .btn.on{background:var(--ink);color:#fff}
.pl-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.pl .banner{background:#fff6d6;border:1px solid #e6cf7a;padding:8px 12px;margin-bottom:16px;font-size:14px}
.pl .q{border:1px solid var(--line);padding:16px 18px;margin:0 0 16px;background:#fff}
.pl .q.ok{border-left:4px solid #2a7f62}.pl .q.bad{border-left:4px solid var(--red)}
.pl .q-prompt{font-weight:700;margin-bottom:10px;display:flex;gap:10px}
.pl .q-n{flex:0 0 26px;height:26px;background:var(--ink);color:#fff;text-align:center;font:700 14px/26px var(--font-head)}
.pl .q-opts{display:grid;gap:8px}
.pl .q-opt{display:flex;gap:10px;align-items:flex-start;padding:8px 10px;border:1px solid var(--line);cursor:pointer}
.pl .q-opt:hover{background:var(--tint)}.pl .q-opt.right{border-color:#2a7f62;background:#eaf6f1}
.pl .q-opt input{margin-top:5px;accent-color:var(--accent)}
.pl .gap{font:inherit;border:0;border-bottom:2px solid var(--ink);background:var(--tint);padding:2px 8px;width:9em;margin:0 4px}
.pl .q-cloze{line-height:2.2}
.pl .q-verdict{font-weight:700;margin:10px 0 0}.pl .q.ok .q-verdict{color:#2a7f62}.pl .q.bad .q-verdict{color:var(--red)}
.pl .q-expl,.pl .q-solution{margin:4px 0 0;color:var(--muted);font-size:15px}
.pl .result{padding:12px 16px;border:1px solid var(--line);margin:8px 0}
.pl .result.pass{background:#eaf6f1;border-color:#2a7f62}.pl .result.fail{background:#fdeef0;border-color:var(--red)}
.pl .form-msg{color:var(--red);min-height:1.4em;margin:6px 0 0}
.pl-done{text-align:left}
@media (max-width:820px){.pl{grid-template-columns:1fr}.pl-nav{position:static;max-height:none;border-right:0;border-bottom:1px solid var(--line)}.pl-main{padding:20px 16px 40px}}