*{box-sizing:border-box}html,body{margin:0;height:100%;font-family:-apple-system,Malgun Gothic,sans-serif;background:#111827;color:#f3f4f6}#app{display:flex;flex-direction:column;height:100%;overflow-x:hidden;overflow-y:auto}#canvas-container{flex:1;min-height:0;position:relative}#canvas-container canvas{display:block;width:100%;height:100%}#controls{padding:16px 20px;background:#1f2937;display:flex;align-items:center;gap:16px;flex-wrap:wrap;flex-shrink:0}#controls label{font-size:14px;white-space:nowrap}#shape-select{background:#111827;color:#f3f4f6;border:1px solid #374151;border-radius:6px;padding:6px 10px;font-size:14px}#fold-slider{flex:1;min-width:200px}#fold-value{font-variant-numeric:tabular-nums;min-width:60px}.hidden{display:none!important}#mode-tabs{display:flex;background:#1f2937;border-top:1px solid #374151;flex-shrink:0}.mode-tab{flex:1;padding:10px;background:transparent;color:#9ca3af;border:none;border-bottom:3px solid transparent;font-size:14px;cursor:pointer}.mode-tab.active{color:#f3f4f6;border-bottom-color:#60a5fa}#quiz-panel{padding:16px 20px;background:#1f2937;flex-shrink:0}#quiz-question{font-size:15px;margin-bottom:12px}#quiz-options{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px}#quiz-options button{background:#111827;color:#f3f4f6;border:1px solid #374151;border-radius:6px;padding:10px 16px;font-size:14px;cursor:pointer}#quiz-options button:hover:not(:disabled){border-color:#60a5fa}#quiz-options button:disabled{cursor:default;opacity:.6}#quiz-options button.wrong{border-color:#f87171;color:#f87171}#quiz-footer{display:flex;align-items:center;flex-wrap:wrap;gap:10px 16px}#quiz-feedback.correct{color:#34d399}#quiz-feedback.wrong-text{color:#f87171}#quiz-score{color:#9ca3af;font-size:14px}#quiz-next{background:#60a5fa;color:#111827;border:none;border-radius:6px;padding:8px 14px;font-size:14px;cursor:pointer;font-weight:600}