*,:before,:after{box-sizing:border-box}:root{--bg:#f5f7fa;--surface:#fff;--border:#d9dfe8;--text:#16233b;--muted:#56637a;--accent:#2347a8;--accent-h:#1b3685;--accent-soft:#e6ecfa;--ok:#1f7a4d;--ok-soft:#e3f3ea;--warn:#a8531a;--warn-soft:#fbede2;--danger:#c0392b;--highlight:#e8720c;--highlight-h:#c75f08;--radius:10px}body{background:var(--bg);color:var(--text);margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:16px}.app-loading{color:var(--muted);padding:2rem}button{cursor:pointer;border-radius:var(--radius);border:none;padding:.45rem 1.1rem;font-family:inherit;font-size:.9rem;transition:background .15s,opacity .15s}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover:not(:disabled){background:var(--accent-h)}.btn-primary:disabled{opacity:.5;cursor:default}.btn-ghost{border:1px solid var(--border);color:var(--text);background:0 0}.btn-ghost:hover:not(:disabled){background:#eef1f6}.btn-ghost:disabled{opacity:.5;cursor:default}.btn-danger{border:1px solid var(--danger);color:var(--danger);background:0 0}.btn-danger:hover:not(:disabled){background:var(--danger);color:#fff}.btn-danger:disabled{opacity:.5;cursor:default}.btn-highlight{background:var(--highlight);color:#fff;flex-shrink:0;font-weight:600;box-shadow:0 2px 10px #e8720c66}.btn-highlight:hover:not(:disabled){background:var(--highlight-h)}.btn-highlight:disabled{opacity:.5;cursor:default}.linklike{color:var(--accent);background:0 0;border:none;padding:.15rem 0;font-size:.78rem;text-decoration:underline}.error-msg{color:var(--danger);margin:.5rem 0;font-size:.88rem}.muted{color:var(--muted);font-size:.9rem}.topic-step-tabs{flex-wrap:wrap;gap:.4rem;margin-bottom:1rem;display:flex}.topic-step-tab{background:var(--bg);border:1px solid var(--border);color:var(--muted);font-size:.82rem;font-weight:600}.topic-step-tab.active{background:var(--accent);color:#fff;border-color:var(--accent)}.topic-step-tab.has-error:not(.active){border-color:var(--danger);color:var(--danger)}.badge{border:1px solid var(--border);color:var(--muted);border-radius:999px;align-items:center;gap:.3rem;padding:.15rem .55rem;font-size:.75rem;font-weight:600;display:inline-flex}.badge.ok{background:var(--ok-soft);color:var(--ok);border-color:var(--ok)}.badge.warn{background:var(--warn-soft);color:var(--warn);border-color:var(--warn)}.badge.late{color:var(--danger);border-color:var(--danger);background:#fbe3e2}.row{flex-wrap:wrap;align-items:center;gap:.6rem;display:flex}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1rem 1.2rem}label.field{color:var(--muted);flex-direction:column;gap:.3rem;margin:.6rem 0;font-size:.85rem;display:flex}label.field input,label.field textarea,label.field select{border:1px solid var(--border);border-radius:var(--radius);color:var(--text);background:var(--surface);padding:.55rem .7rem;font-family:inherit;font-size:1rem}label.field input:focus,label.field textarea:focus,label.field select:focus{outline:2px solid var(--accent);border-color:#0000}.guide-presenter{background:linear-gradient(165deg, var(--accent-soft) 0%, var(--bg) 55%);flex-direction:column;min-height:100vh;display:flex}.guide-presenter-top{justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.4rem;display:flex}.guide-presenter-title{color:var(--accent);letter-spacing:.02em;font-weight:700}.guide-dots{flex-wrap:wrap;justify-content:center;align-items:center;gap:.4rem;display:flex}.guide-dot{background:var(--border);border-radius:999px;width:9px;height:9px;transition:background .2s,transform .2s}.guide-dot.current{background:var(--accent);transform:scale(1.35)}.guide-dot.done{background:var(--accent);opacity:.45}.guide-presenter-body{flex:1;justify-content:center;align-items:center;padding:1.5rem;display:flex}.guide-slide-card{background:var(--surface);border:1px solid var(--border);border-radius:20px;width:100%;max-width:760px;padding:2.6rem 3rem;box-shadow:0 18px 50px -24px #10204659}.guide-slide-card.summary{border-color:var(--accent);background:linear-gradient(180deg, var(--surface) 0%, var(--accent-soft) 130%)}.guide-slide-heading{color:var(--text);margin:0 0 1.1rem;font-size:clamp(1.5rem,3vw,2.1rem);line-height:1.25}.guide-slide-image{border-radius:12px;width:100%;height:auto;margin:0 0 .9rem;display:block}.guide-slide-p{color:var(--text);margin:0 0 .9rem;font-size:1.08rem;line-height:1.6}.guide-slide-list{color:var(--text);margin:0 0 .9rem;padding-left:1.4em;font-size:1.05rem;line-height:1.65}.guide-slide-list li{margin-bottom:.35rem}.guide-slide-examples{flex-direction:column;gap:.7rem;margin:.4rem 0 .9rem;display:flex}.guide-example-pair{flex-direction:column;gap:.4rem;display:flex}.guide-example{border-radius:var(--radius);flex-direction:column;gap:.15rem;padding:.55rem .8rem;font-size:.98rem;display:flex}.guide-example span{letter-spacing:.06em;text-transform:uppercase;font-size:.7rem;font-weight:700}.guide-example.weak{background:var(--warn-soft);color:var(--warn)}.guide-example.weak span{color:var(--warn)}.guide-example.strong{background:var(--ok-soft);color:var(--ok)}.guide-example.strong span{color:var(--ok)}.guide-presenter-nav{justify-content:space-between;align-items:center;gap:1rem;padding:1.1rem 1.4rem 1.6rem;display:flex}.guide-step-count{color:var(--muted);font-family:ui-monospace,monospace;font-size:.8rem}.guide-presenter-nav .btn-primary{padding:.6rem 1.5rem;font-size:1rem}.guide-opened-badge{background:var(--ok-soft);color:var(--ok);border:1px solid var(--ok);white-space:nowrap;border-radius:999px;align-items:center;gap:.4rem;padding:.35rem .9rem;font-size:.85rem;font-weight:600;display:inline-flex}.guide-wait-overlay{z-index:50;background:linear-gradient(165deg, var(--accent-soft) 0%, var(--bg) 60%);flex-direction:column;justify-content:center;align-items:center;padding:1.2rem;display:flex;position:fixed;inset:0;overflow-y:auto}.guide-wait-badge{background:var(--accent);color:#fff;border-radius:999px;align-items:center;gap:.5rem;margin-bottom:1.1rem;padding:.35rem .9rem;font-size:.8rem;font-weight:600;display:inline-flex}.guide-wait-badge .dot-anim{background:#fff;border-radius:999px;width:7px;height:7px;animation:1.1s ease-in-out infinite guide-pulse}@keyframes guide-pulse{0%,to{opacity:.35}50%{opacity:1}}.guide-wait-overlay .guide-slide-card{max-width:620px}.guide-help-fab{background:var(--surface);border:1px solid var(--accent);color:var(--accent);align-items:center;gap:.4rem;font-weight:600;display:inline-flex}.guide-help-fab:hover:not(:disabled){background:var(--accent-soft)}.guide-help-modal .guide-slide-card{max-width:560px;margin:0 auto}.checklist-item{cursor:pointer;align-items:flex-start;gap:.55rem;padding:.4rem 0;font-size:.95rem;display:flex}.checklist-item input{margin-top:.2rem}.checklist-item.checked span{color:var(--muted);text-decoration:line-through}.quiz-option{border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;align-items:flex-start;gap:.55rem;margin-bottom:.4rem;padding:.5rem .65rem;font-size:.95rem;display:flex}.quiz-option input{margin-top:.2rem}.quiz-option.right{border-color:var(--ok);background:var(--ok-soft)}.quiz-option.wrong{border-color:var(--danger);background:#fbe3e2}.quiz-why{color:var(--muted);margin-top:.15rem;font-size:.8rem;display:block}.quiz-result-ok{background:var(--ok-soft);color:var(--ok);border-radius:var(--radius);margin-top:.6rem;padding:.6rem .8rem;font-weight:600}.dialog-backdrop{z-index:400;background:#00000080;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.dialog-card{background:var(--surface);border-radius:var(--radius);text-align:left;width:100%;max-width:440px;max-height:92vh;padding:1.4rem 1.5rem 1.25rem;overflow-y:auto;box-shadow:0 8px 40px #00000040}.dialog-title{margin:0 0 .7rem;font-size:1.1rem}.dialog-body{color:var(--text);font-size:.92rem;line-height:1.5}.dialog-body p{margin:.5rem 0}.dialog-body p:first-child{margin-top:0}.dialog-body ul{margin:.5rem 0;padding-left:1.2rem}.dialog-body li{margin:.3rem 0}.dialog-body .muted{font-size:.85rem}.dialog-field{color:var(--muted);flex-direction:column;gap:.3rem;margin-top:.9rem;font-size:.8rem;display:flex}.dialog-field input{border:1px solid var(--border);border-radius:var(--radius);color:var(--text);padding:.5rem .7rem;font-size:.95rem}.dialog-field input:focus{outline:2px solid var(--accent);border-color:#0000}.dialog-actions{flex-wrap:wrap;justify-content:flex-end;gap:.5rem;margin-top:1.2rem;display:flex}
