.app-shell{min-height:100vh;display:grid;grid-template-columns:minmax(300px,380px) 1fr;gap:16px;padding:16px;background:#edf6f2}.control-panel,.canvas-stage,.result-panel{border:1px solid #c8d8d0;background:#fff;border-radius:8px;padding:16px}.panel-heading{margin-bottom:16px}.eyebrow{margin:0 0 4px;color:#38695f;font-size:.8rem;letter-spacing:0;font-weight:600}.panel-heading h1{margin:0 0 8px;font-size:1.5rem;line-height:1.25}.intro-text{margin:0;line-height:1.5}.panel-section{margin:12px 0}.panel-section h2{margin:0 0 8px;font-size:.95rem;color:#27463e}.command-section{padding:12px;border:1px solid #9ec8bc;border-radius:8px;background:linear-gradient(180deg,#f8fffb,#edf8f3)}.command-section h2{display:inline-flex;align-items:center;gap:6px;color:#12382f;font-size:1rem}.command-section h2:before{content:"";width:10px;height:10px;border-radius:999px;background:#1f7a5c;box-shadow:0 0 0 4px #1f7a5c24}.button-row,.action-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}.button-row{margin-bottom:8px}.wide-action{width:100%;margin-bottom:8px}button{border:1px solid #b9d1ca;border-radius:8px;background:#f4fbf6;color:#15312a;padding:8px 12px;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px}button svg{width:18px;height:18px}.primary-action{background:#1f7a5c;color:#fff;border-color:#155f46}.secondary-action{background:#e9f5ef}.command-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}.command-row{position:relative;border:2px solid #9ec8bc;border-left:8px solid #1f7a5c;border-radius:8px;padding:12px 14px;font-size:.95rem;min-height:40px;display:flex;align-items:center;background:#fff;box-shadow:0 4px #1f7a5c1f}.command-row--editable{align-items:flex-start;flex-direction:column;gap:8px}.command-row--move{border-left-color:#2f7dd1}.command-row--turn,.command-row--repeatPolygon{border-left-color:#c67813}.command-row--penColor{border-left-color:#6c4fb6}.block-title{width:100%;border-bottom:1px solid #dcece6;padding-bottom:6px;font-size:.9rem;font-weight:700;margin:0;color:#264e45}.block-fields{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}.turn-field-row{display:grid;grid-template-columns:minmax(120px,1fr) minmax(120px,1fr);gap:10px;width:100%}.turn-field-row .block-fields{align-items:flex-start;flex-direction:column;gap:6px}.turn-field-row .block-fields input[type=number],.turn-field-row .block-fields select{width:100%}.block-fields label{font-size:.85rem}.block-fields input[type=number],.block-fields select,.builder-row input[type=number],.builder-row select{width:min(140px,100%);border:1px solid #b9d1ca;border-radius:6px;padding:5px 6px;min-height:32px}.repeat-block{display:grid;gap:8px;width:100%}.repeat-count-row{display:flex;flex-wrap:wrap;gap:8px}.repeat-inner{display:grid;gap:8px;padding:10px;border-left:3px solid #9cc9bb;border-radius:6px;background:#f4fbf8}.repeat-inner-title{margin:0;color:#2f5a50;font-size:.82rem;font-weight:700}.repeat-step-grid,.command-builder{display:grid;gap:8px}.builder-row{display:grid;grid-template-columns:minmax(72px,auto) minmax(72px,1fr);align-items:center;gap:8px;padding:8px;border:1px solid #d9e8e2;border-radius:8px;background:#fbfefe}.builder-row--turn{grid-template-columns:minmax(36px,auto) minmax(78px,.9fr) minmax(72px,auto) minmax(72px,1fr)}.builder-row--repeat{grid-template-columns:minmax(72px,auto) minmax(72px,1fr)}.builder-row label{color:#27463e;font-size:.85rem;font-weight:700}.builder-row button{grid-column:1 / -1}.speed-control{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;color:#1f3a34}.speed-control strong{color:#1f7a5c}.speed-slider{width:100%;accent-color:#1f7a5c}.speed-labels{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;margin-top:4px;color:#526b62;font-size:.72rem;text-align:center}.command-row.empty{border-left-color:#91a8a0;box-shadow:none;color:#6d7f79}.color-control{display:inline-flex;align-items:center;gap:8px;margin-bottom:8px;color:#1f3a34}.color-control input[type=color]{width:42px;height:40px;border:1px solid #b9d1ca;border-radius:8px;background:none;padding:2px}.canvas-stage{display:grid;align-content:start;gap:12px;min-height:520px}.canvas-controls{display:grid;grid-template-columns:minmax(240px,1.35fr) minmax(140px,.45fr) minmax(260px,1fr);gap:14px;align-items:start;border:1px solid #b9d1ca;border-radius:8px;background:#fbfefe;padding:14px}.canvas-control-section{display:grid;align-content:start;gap:8px;min-width:0}.canvas-control-section h2{margin:0;color:#27463e;font-size:.95rem}.canvas-controls .color-control{margin-bottom:0}.canvas-control-section--actions .action-row{grid-template-columns:repeat(2,minmax(120px,1fr))}.canvas-control-section--actions button{min-height:44px}.workspace{min-height:100%;display:grid;gap:12px}.result-panel{border:1px solid #c8d8d0;background:#fff;border-radius:8px;padding:16px;display:grid;gap:12px}.result-panel h2{margin:0 0 6px}.result-panel p{margin:0 0 8px;line-height:1.45}.lesson-panel,.reflection-panel{border:1px solid #d8e8e1;background:#f8fcfa;border-radius:8px;padding:12px}.math-facts{margin:0;padding:0;list-style:none;display:grid;gap:8px}.math-facts dt{font-weight:700;font-size:.9rem}.math-facts dd{margin:0;font-size:.95rem}.exploration-note{margin:0;color:#48665b}.status{margin-top:10px;font-weight:700;padding:10px;border-radius:8px;background:#eef9f2;border:1px solid #c2dfd2}.turtle-canvas{width:100%;aspect-ratio:19 / 14;max-height:calc(100vh - 48px);border:1px solid #b8cdc4;border-radius:8px;background:#fbfdfb}@media(max-width:840px){.app-shell{grid-template-columns:1fr;padding:10px;overflow-x:hidden}.workspace{grid-template-rows:auto auto}.button-row,.action-row{align-items:stretch}.button-row button,.action-row button{width:100%}.app-shell,.canvas-stage,.workspace,.control-panel,.result-panel,.lesson-panel,.reflection-panel{overflow-x:hidden}.workspace{min-width:0;max-width:100%}.turtle-canvas{max-width:100%;max-height:52vh}.canvas-controls{grid-template-columns:1fr;padding:12px}.canvas-control-section--actions .action-row{grid-template-columns:repeat(2,minmax(0,1fr))}.button-row,.action-row{gap:6px;grid-template-columns:1fr}.builder-row,.builder-row--turn,.builder-row--repeat,.turn-field-row{grid-template-columns:1fr;align-items:stretch}.builder-row button,.builder-row input[type=number],.builder-row select{width:100%}}@media(min-width:841px)and (max-width:1180px){.canvas-controls{grid-template-columns:minmax(220px,1fr) minmax(140px,.55fr)}.canvas-control-section--actions{grid-column:1 / -1}}@media(max-width:520px){.canvas-control-section--actions .action-row{grid-template-columns:1fr}}:root{font-family:Inter,Pretendard,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#16231f;background:#edf6f2;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input,select{font:inherit}
