:root{--bg-page: #FFFFFF;--bg-surface: #F0F4F3;--bg-surface-muted: #E8ECF0;--bg-subtle: rgba(0, 0, 0, .02);--bg-overlay: rgba(255, 255, 255, .9);--bg-overlay-strong: rgba(240, 244, 243, .95);--bg-backdrop: rgba(0, 0, 0, .4);--border-default: #D6DDE3;--border-focus: #0F6E56;--text-primary: #1A2332;--text-secondary: #5A6B7A;--text-muted: #8E99A4;--color-accent: #0F6E56;--color-accent-hover: #085041;--color-accent-bg: rgba(15, 110, 86, .1);--color-accent-subtle: rgba(15, 110, 86, .05);--color-accent-border: rgba(15, 110, 86, .3);--color-danger: #C03B3B;--color-danger-bg: rgba(192, 59, 59, .1);--color-danger-border: rgba(192, 59, 59, .4);--color-purple: #a78bfa;--color-purple-bg: rgba(167, 139, 250, .1);--color-purple-border: rgba(167, 139, 250, .3);--color-warning: #B8860B;--color-warning-bg: rgba(184, 134, 11, .1);--color-warning-border: rgba(184, 134, 11, .3);--color-warning-text: #B8860B;--color-success: #0F6E56;--color-question: #60a5fa;--color-good-point: #4ade80;--color-text-ref: #fbbf24;--color-connection: #0F6E56;--color-node-fill: #FFFFFF;--color-node-stroke: #0F6E56;--color-node-active-fill: #0F6E56;--color-node-active-text: #FFFFFF;--color-node-initials: rgba(26, 35, 50, .7);--color-node-outer-fill: #E8ECF0;--color-group-stroke: #D6DDE3;--color-group-stroke-active: #0F6E56;--btn-primary-bg: #0F6E56;--btn-primary-text: #FFFFFF;--btn-secondary-bg: transparent;--btn-secondary-border: #D6DDE3;--btn-secondary-text: #5A6B7A;--toggle-knob: #FFFFFF}html.dark{--bg-page: #0f172a;--bg-surface: #1e293b;--bg-surface-muted: #334155;--bg-subtle: rgba(255, 255, 255, .03);--bg-overlay: rgba(30, 41, 59, .9);--bg-overlay-strong: rgba(15, 23, 42, .95);--bg-backdrop: rgba(0, 0, 0, .7);--border-default: #334155;--border-focus: #2dd4bf;--text-primary: #e2e8f0;--text-secondary: #94a3b8;--text-muted: #64748b;--color-accent: #2dd4bf;--color-accent-hover: #5eead4;--color-accent-bg: rgba(45, 212, 191, .1);--color-accent-subtle: rgba(45, 212, 191, .05);--color-accent-border: rgba(45, 212, 191, .3);--color-danger: #f87171;--color-danger-bg: rgba(248, 113, 113, .1);--color-danger-border: rgba(239, 68, 68, .4);--color-purple: #a78bfa;--color-purple-bg: rgba(167, 139, 250, .15);--color-purple-border: rgba(167, 139, 250, .3);--color-warning: #fbbf24;--color-warning-bg: rgba(251, 191, 36, .1);--color-warning-border: rgba(251, 191, 36, .3);--color-warning-text: #fde68a;--color-success: #22c55e;--color-connection: #4a9eff;--color-node-fill: #1e293b;--color-node-stroke: #2dd4bf;--color-node-active-fill: #3b82f6;--color-node-active-text: #FFFFFF;--color-node-initials: rgba(255, 255, 255, .5);--color-node-outer-fill: #334155;--color-group-stroke: #475569;--color-group-stroke-active: #3b82f6;--btn-primary-bg: #2dd4bf;--btn-primary-text: #0f172a;--btn-secondary-bg: #334155;--btn-secondary-border: #334155;--btn-secondary-text: #94a3b8;--toggle-knob: #e2e8f0}*,*:before,*:after{box-sizing:border-box}html,body,#root{margin:0;padding:0;width:100%;min-height:100%}body{background:var(--bg-page);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.student-node{-webkit-tap-highlight-color:transparent}.gd-page{box-sizing:border-box;min-height:100dvh;padding:max(20px,env(safe-area-inset-top)) 24px max(28px,env(safe-area-inset-bottom));color:var(--text-primary);background:var(--bg-page)}.gd-wrap{max-width:720px;margin:0 auto}.gd-head{display:flex;align-items:center;gap:14px;padding-bottom:16px;margin-bottom:20px;border-bottom:1px solid var(--border-default)}.gd-logo{width:44px;height:44px;object-fit:contain;flex-shrink:0}.gd-head-text{flex:1;min-width:0}.gd-kicker{margin:0;font-size:13px;letter-spacing:.04em;color:var(--text-secondary)}.gd-class{margin:2px 0 0;font-size:22px;font-weight:700;line-height:1.25;overflow-wrap:anywhere}.gd-h2{margin:0 0 4px;font-size:18px;font-weight:700}.gd-sub{margin:0 0 12px;font-size:15px;color:var(--text-secondary)}.gd-chips{display:flex;flex-wrap:wrap;gap:10px}.gd-chip{min-height:48px;min-width:44px;padding:10px 16px;font-size:17px;font-family:inherit;color:var(--text-primary);background:var(--bg-surface);border:1px solid var(--border-default);border-radius:10px;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.gd-chip[aria-pressed=true]{font-weight:700;background:var(--color-accent-bg);border:2px solid var(--color-accent);padding:9px 15px}.gd-field{display:flex;flex-direction:column;gap:6px;margin-bottom:18px}.gd-label{font-size:16px;font-weight:700}.gd-hint{font-size:14px;color:var(--text-secondary)}.gd-input{box-sizing:border-box;width:100%;min-height:48px;padding:10px 14px;font-size:17px;font-family:inherit;color:var(--text-primary);background:var(--bg-page);border:1px solid var(--border-default);border-radius:10px}.gd-input:focus-visible,.gd-chip:focus-visible,.gd-btn:focus-visible,.gd-link:focus-visible{outline:2px solid var(--border-focus, var(--color-accent));outline-offset:2px}.gd-btn{min-height:52px;padding:12px 20px;font-size:18px;font-weight:700;font-family:inherit;color:var(--btn-primary-text);background:var(--color-accent);border:none;border-radius:10px;cursor:pointer;touch-action:manipulation}.gd-btn-wide{width:100%}.gd-btn-quiet{min-height:44px;padding:10px 16px;font-size:16px;font-weight:600;font-family:inherit;color:var(--text-primary);background:transparent;border:1px solid var(--border-default);border-radius:10px;cursor:pointer;touch-action:manipulation}.gd-link{min-height:44px;padding:10px 0;font-size:15px;font-family:inherit;color:var(--color-accent);background:none;border:none;text-decoration:underline;text-underline-offset:3px;cursor:pointer}.gd-alert{margin:0 0 16px;padding:12px 14px;font-size:16px;line-height:1.45;color:var(--text-primary);background:var(--color-danger-bg);border:1px solid var(--color-danger-border);border-radius:10px}.gd-error{margin:0 0 12px;font-size:15px;color:var(--color-danger)}.gd-code-row{display:flex;gap:10px;align-items:stretch}.gd-code-row .gd-input{flex:1;letter-spacing:.08em;text-transform:uppercase}.gd-section+.gd-section{margin-top:24px}.gd-foot{margin-top:20px;padding-top:12px;border-top:1px solid var(--border-default)}.gd-report-note{margin:12px 0 0;font-size:15px;color:var(--text-secondary)}@media(orientation:landscape)and (min-width:900px){.gd-wrap{max-width:1000px}.gd-grid{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:32px;align-items:start}.gd-grid>.gd-section+.gd-section{margin-top:0;padding-left:32px;border-left:1px solid var(--border-default)}}.app{min-height:100vh;background:var(--bg-page);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.toolbar{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;background:var(--bg-surface);border-bottom:1px solid var(--border-default)}.toolbar-left{display:flex;align-items:center;gap:12px}.toolbar-title{font-size:16px;font-weight:600}.toolbar-topic{font-size:13px;color:var(--text-muted);font-style:italic}.toolbar-live{font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--color-accent);background:var(--color-accent-bg);padding:3px 8px;border-radius:4px;animation:pulse-live 2s ease-in-out infinite}@keyframes pulse-live{0%,to{opacity:1}50%{opacity:.5}}.toolbar-right{display:flex;gap:8px}.btn{padding:8px 16px;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s,opacity .2s}.btn:hover{opacity:.9}.btn-primary{background:var(--btn-primary-bg);color:var(--btn-primary-text)}.btn-secondary{background:var(--btn-secondary-bg);border:1px solid var(--btn-secondary-border);color:var(--btn-secondary-text)}.canvas-container{flex:1;height:calc(100vh - 57px)}.recording-indicator{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--color-danger);background:var(--color-danger-bg);padding:3px 8px;border-radius:4px}.recording-dot{width:8px;height:8px;border-radius:50%;background:var(--color-danger);animation:pulse-rec 1.5s ease-in-out infinite}@keyframes pulse-rec{0%,to{opacity:1}50%{opacity:.3}}@keyframes fadeIn{0%{opacity:0;transform:translate(-50%) translateY(-8px)}to{opacity:1;transform:translate(-50%) translateY(0)}}