.learning-dialog{width:min(820px,calc(100vw - 28px));max-height:85vh;box-sizing:border-box;padding:24px;border:1px solid #dce6ec;border-radius:22px;color:#253b4c;background:#fff;overflow:auto;box-shadow:0 24px 80px #102c4140}
.learning-dialog::backdrop{background:#0d233961;backdrop-filter:blur(4px)}.learning-dialog header{display:flex;align-items:center;justify-content:space-between;gap:16px}.learning-dialog h2{margin:4px 0;font-size:25px;letter-spacing:-.03em}.learning-dialog h3{font-size:14px;margin:0 0 8px;color:#103b54}.learning-dialog p,.learning-dialog li{font-size:13px;line-height:1.75}.learning-dialog a{color:#07658a}.learning-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0}.learning-grid section{background:#f5f9fc;border:1px solid #e3ecf2;border-radius:14px;padding:16px}.learning-grid p{margin:0}.learning-example{padding:16px;border-radius:14px;background:linear-gradient(110deg,#edf8ff,#fff4ef);margin-bottom:20px}.learning-dialog button:focus-visible,.program-tabs button:focus-visible,.program-chart:focus-visible{outline:3px solid #168ad0;outline-offset:3px}
.converter-header{flex-wrap:wrap}.converter-header .btn{font-size:12px}.program-tabs{display:flex;gap:4px;padding:10px 16px;background:#f6f9fc;border-bottom:1px solid #e5ecf1}.program-tabs button{border:0;border-radius:9px;padding:9px 18px;background:transparent;color:#456071;cursor:pointer;font-size:13px}.program-tabs button[aria-selected=true]{background:#fff;box-shadow:0 1px 5px #153e511a;color:#076889;font-weight:650}.code-panel [hidden]{display:none!important}.program-chart{max-height:620px;overflow:auto;padding:20px;background:radial-gradient(#deebf2 .8px,transparent .8px) 0 0/16px 16px;font-size:12px}.chart-caption{margin:0 0 20px;color:#516b7c;line-height:1.7}.chart-node{max-width:330px;margin:auto;border:1px solid #cedee7;border-radius:10px;background:#fff;padding:11px 14px;text-align:center;line-height:1.5;overflow-wrap:anywhere;color:#233f52}.chart-terminal{border-radius:40px;background:#e8f6fe;border-color:#a9d9f0;color:#085777;font-weight:650}.chart-input{background:#effaf8;border-color:#b6e4da}.chart-decision{border:0;border-radius:0;background:#fff0dc;clip-path:polygon(9% 0,91% 0,100% 50%,91% 100%,9% 100%,0 50%);padding:16px 24px;color:#794515;font-weight:650}.chart-arrow{height:26px;line-height:26px;text-align:center;color:#7191a3;font-size:20px}.chart-branches{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;border-top:1px solid #b9ceda;padding-top:10px}.chart-branches section{min-width:0}.chart-branches h4{text-align:center;color:#12624a;font-size:11px;margin:0 0 8px}.chart-branches section+section>h4{color:#9b4930}.chart-branches .chart-node{padding:9px 8px;font-size:11px}.chart-merge{height:18px;border:1px solid #b9ceda;border-top:0;margin:0 16%}.chart-muted{color:#526c7c;background:#f5f8fb}.chart-halt{color:#a93227;border-color:#e9b8ad;background:#fff3ef}.chart-loop{border-left:2px solid #8bc4e1;border-radius:15px;padding:14px 12px;margin-top:6px}.chart-sequence{padding:12px;border:1px dashed #9ec4d8;border-radius:12px;background:#f5faff}.chart-sequence h4{margin:0 0 8px;text-align:center;color:#24546d}.chart-sequence p{font-size:11px;color:#516b7c;line-height:1.6}.chart-branches .chart-branches{gap:5px}.chart-branches .chart-branches .chart-node{font-size:10px}
.chart-decision{clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);padding:34px 65px;min-height:105px;display:flex;align-items:center;justify-content:center;box-sizing:border-box}.chart-input{border-radius:3px;border-left:4px solid #5cb4a0}.learning-dialog button{cursor:pointer}
@media(max-width:600px){.learning-dialog{padding:18px}.learning-grid{grid-template-columns:1fr}.learning-dialog h2{font-size:22px}.program-chart{padding:14px}.chart-loop{padding:12px 6px}.chart-branches{gap:8px}.chart-decision{padding:32px 46px}}