/* 같은 테마를 모든 단원에 사용한다. 진행 여부만 색과 글자로 표시한다. */
#session-language{color:#617268!important}.session-runtime{color:#60756a!important}.file-icon{color:#4f705a!important}.ed-actions #restore{color:#5c7362!important}.gutter,.ed-foot{color:#64796b!important}
.top{gap:20px}.brand{font-weight:700}.session-title{padding-left:20px}.tally{display:none}
#session-language{font-size:11px;color:#6e8076;padding:3px 8px;border:1px solid #e0e7e2;border-radius:5px;line-height:1.45;white-space:nowrap}
.session-runtime{display:flex;align-items:center;gap:8px;margin-left:auto;font-size:11px;color:#72877a;white-space:nowrap}
.session-runtime i{width:6px;height:6px;background:#3da47f;box-shadow:0 0 0 3px #eef8f1;border-radius:50%}.session-runtime.busy i{background:#d5a64c;box-shadow:0 0 0 3px #faf5e8}
.header-button{padding:7px 13px;background:#fff;border:1px solid #dfe5e1;border-radius:9px;font-size:12px;cursor:pointer;white-space:nowrap}.header-link,.header-info{border:0;background:none;padding:0;font-size:12px;color:#425c4d;cursor:pointer;white-space:nowrap}.header-info{display:flex;align-items:center}
.brief{border-color:#e4ece7}.mission-label{color:#597568;margin-bottom:12px}.brief h1{position:absolute;width:1px;height:1px;padding:0;margin:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.brief .task{font-size:15px;line-height:1.9;margin:0;color:#2c4337}.mission-row{right:24px;top:20px}.tips:not([open]) summary::after{font-weight:600;color:#578172}
.file-bar{color:#577064}.file-icon{background:#edf3ed;color:#547a60}.language-menu{color:#60776b}.ed-actions #run{font-size:14px;border-radius:9px;font-weight:650;box-shadow:0 3px 7px #24795b19}.ed-actions #restore{margin-left:auto;background:#f2f6f3;border-color:#e1e9e2;border-radius:9px;color:#708775}.api{max-height:150px}.api>summary{font-size:11px;color:#61756a;padding-top:12px;padding-bottom:8px}.api dl>div{margin:3px 0;line-height:1.8}.api dd{font-size:12px;line-height:1.8}.ed-foot{color:#6b8072}.gutter{color:#8a9d91}.editor .hl .cur{background:#f3f8f4}.editor:focus-within{box-shadow:none}
.tabs button:only-child{display:none}.game-tools{position:absolute;left:26px;bottom:5px;display:flex;align-items:center;gap:7px;z-index:6;border-radius:5px;padding:3px 5px;background:#edf3f1e8;max-width:calc(100% - 50px)}
.game-tools .legend-box{position:relative;left:auto;bottom:auto;padding:0;border:0;background:transparent;border-radius:0;max-width:none}.game-tools .legend-box>summary{font-size:11px;color:#557361;min-height:22px}.game-tools .legend-box[open]{position:absolute;left:0;bottom:0;background:white;padding:10px 14px;box-shadow:0 6px 24px #183e3020;border-radius:10px;width:340px;max-width:calc(100vw - 60px)}
.game-tools #answer-apply{font-size:11px!important;min-height:24px!important;padding:4px 9px!important;border:1px solid #bfd8c9!important;border-radius:6px;background:#e2f2e8!important;color:#226747!important;margin:0;font-weight:650;white-space:nowrap;cursor:pointer}.game-tools #answer-apply .i{display:none}.stage-foot{bottom:39px}
#result.ok,#result.bad{display:none}
.ui-dialog{color:#294333;background:#fff;border:1px solid #dbe5dd;border-radius:18px;box-shadow:0 16px 80px #0f2f2b33;padding:0;max-width:calc(100vw - 40px);max-height:calc(100dvh - 48px);overflow:auto;margin:auto;font-family:var(--sans)}
.ui-dialog::backdrop{background:#12372a55;backdrop-filter:blur(5px)}
.ui-dialog h2{color:#264d36}.ui-dialog button{cursor:pointer;transition:background-color .15s ease-out}.ui-dialog button:hover{filter:brightness(.97)}.ui-dialog button:disabled{cursor:wait;opacity:.6}
#stage-dialog{width:820px;border-radius:22px;overflow:hidden;max-width:calc(100vw - 48px);box-shadow:0 24px 100px #0e36293d;border:0}
.problem-browser{display:flex;flex-direction:column;max-height:calc(100dvh - 48px)}.problem-browser header{display:flex;justify-content:space-between;align-items:center;padding:28px 30px 22px}.problem-browser h2{font-size:24px;font-weight:700;margin:0;color:#2b503a}.browser-close{border:0;background:#f1f6f2;border-radius:50%;width:32px;height:32px;display:grid;place-items:center;color:#597963;padding:0}
.problem-tabs{display:flex;align-items:center;gap:8px;padding:0 30px 20px;border-bottom:1px solid #e7eee8}.problem-tabs [role=tablist]{display:flex;gap:8px;flex:none}.problem-tabs button{border:0;border-radius:8px;background:#f3f7f4;padding:9px 15px;font:600 12px var(--sans);color:#57725e}.problem-tabs button.selected{background:#e5f3eb;color:#24795b}.problem-tabs input{margin-left:auto;border:1px solid #dce7df;border-radius:8px;padding:8px 12px;font:12px var(--sans);width:180px;min-width:0;background:#fff;color:#284334}.problem-tabs input::placeholder{color:#687d6e}
.problem-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:10px;overflow:auto;padding:24px 30px;min-height:140px;scrollbar-gutter:stable}.problem-tile{border:1px solid #e0e9e2;border-radius:10px;min-height:65px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:#52705a;text-decoration:none;transition:background-color .15s,border-color .15s}.problem-tile>span{font:600 15px var(--sans)}.problem-tile small{display:flex;gap:3px;align-items:center;font:10px var(--sans);color:#687c6e}.problem-tile small svg{width:13px;height:13px}.problem-tile.done{background:#f9fcfa}.problem-tile.done small{color:#24795b}.problem-tile.current{outline:2px solid #2c8863;outline-offset:-1px;border-color:transparent;background:#f1faf4}.problem-tile:hover{background:#f1f8f3;border-color:#8bb39a}.problem-tile:focus-visible{outline:2px solid #24795b;outline-offset:2px}.stage-empty{grid-column:1/-1;padding:25px 0;text-align:center;color:#61796a;font-size:13px}
.problem-browser footer{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:17px 30px;border-top:1px solid #e7eee8;color:#62796a;font-size:11px}.problem-browser footer label{display:flex;align-items:center;gap:6px;cursor:pointer}.problem-browser footer input{margin:0;width:13px;height:13px;accent-color:#24795b}
#completion-dialog{width:440px;border-radius:24px;box-shadow:0 24px 100px #0e36293d;border:1px solid #e6eee7}.completion-card{padding:32px 36px 26px;text-align:center}.completion-mark{width:64px;height:64px;margin:0 auto 18px;border-radius:50%;background:#e6f3eb;display:grid;place-items:center;color:#24795b}.completion-mark svg{width:39px;height:39px}.completion-card h2{font-size:25px;font-weight:700;margin:0 0 16px}.completion-message{font-size:13px;color:#657e6b;line-height:1.9;margin:0 0 28px;word-break:keep-all;white-space:pre-line}.completion-actions{display:flex;gap:10px}.completion-actions button{flex:1;padding:13px 8px;border:1px solid #dfe8e0;background:#fff;color:#4a6952;border-radius:10px;font:650 13px var(--sans)}.completion-actions #completion-next{background:#24795b;color:#fff;border-color:#24795b}.completion-actions span{margin-left:10px}.completion-shortcut{font-size:11px;color:#647d6a;margin:18px 0 0}
#help-dialog,#failure-dialog,#about-dialog{width:520px}.notice-card{padding:32px}.notice-card h2{font-size:18px;font-weight:650;line-height:1.5;margin:0 0 18px;color:#263e33}.notice-card p,.failure-message{font-size:14px;line-height:1.9;color:#52665a}.notice-card p{margin:8px 0}.notice-confirm{display:block;margin:28px 0 0 auto;min-width:96px;background:#24795b;color:#fff;border:0;border-radius:9px;padding:12px 20px;font-size:14px;font-weight:600}.failure-message .vlist{list-style:none;padding:0;margin:0}.failure-message .mk{width:14px;height:14px;flex:none;color:#ab4a32}.failure-message .vline{align-items:baseline;margin:8px 0}.failure-message .vline b{font-weight:600}.help-message .checks{margin:12px 0}.help-message .outcome{padding-top:10px;border-top:1px solid #edf1ee}.help-message .outcome b{font-weight:650}
.ui-dialog[open]{animation:dialog-arrive .2s cubic-bezier(.16,1,.3,1)}@keyframes dialog-arrive{from{transform:translateY(8px);opacity:.5}to{transform:translateY(0);opacity:1}}@media(prefers-reduced-motion:reduce){.ui-dialog[open]{animation:none}}
@media(max-width:1100px){.top{gap:12px}.session-runtime{font-size:10px}.header-link{display:none}.brief{padding:14px 16px}.mission-row{right:16px;top:12px}.mission-label{margin-bottom:12px}.brief .task,.brief h1{font-size:13px;line-height:1.9}.pane-code{padding:12px 10px 12px 12px}.ed-foot .hint{display:none}.ed-actions{min-height:76px;padding:16px 12px 14px}.ed-actions #run{flex-basis:100px}.ed-actions #restore{margin-left:auto}.game-tools{left:16px}}
@media(max-width:760px){.top{gap:9px}.brand{font-size:13px}.session-title{padding-left:9px}.session-runtime,.header-info{display:none}#session-language{font-size:9px;padding:2px 4px}#stage-open{margin-left:auto;font-size:11px;padding:6px 9px}.pane-code{padding:12px}.game-tools{left:12px}.problem-browser header{padding:22px 20px 18px}.problem-tabs{padding:0 20px 16px;flex-wrap:wrap}.problem-tabs input{width:100%;margin:4px 0 0}.problem-grid{grid-template-columns:repeat(4,minmax(0,1fr));padding:18px 20px;gap:9px}.problem-browser footer{padding:14px 20px}#stage-dialog{max-width:calc(100vw - 24px)}.problem-browser h2{font-size:21px}.completion-card{padding:28px 24px 22px}.notice-card{padding:26px}.game-tools .legend-box[open]{max-width:calc(100vw - 40px)}.completion-actions button{font-size:12px}}
/* 3점 채점: 별·채점 기준·하나의 스테이지 목록·결과 창. 모든 단원에 같은 흰색·녹색 테마. */
.stars{display:inline-flex;gap:1px;align-items:center;vertical-align:middle}.star{width:13px;height:13px;fill:#fff;stroke:#a9bcb0;stroke-width:1.4;stroke-linejoin:round}.star.on{fill:#2f8a66;stroke:#24795b}
.rubric{margin-top:10px;font-size:12px;color:#486356}.rubric>summary{display:flex;align-items:center;gap:8px;cursor:pointer;list-style:none;min-height:26px;width:max-content;max-width:100%;padding:2px 10px 2px 8px;border:1px solid #dfe9e2;border-radius:8px;background:#fff}.rubric>summary::-webkit-details-marker{display:none}.rubric>summary::after{content:'⌄';color:#6b8174;margin-left:2px;line-height:1}.rubric[open]>summary::after{content:'⌃'}.rubric>summary:focus-visible{outline:2px solid #24795b;outline-offset:2px}
.rubric-label{font-weight:650;color:#2d4c3c}.rubric-best{color:#5d7466;font-size:11px}
.rubric-items{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:4px}.rubric-items li{display:grid;grid-template-columns:34px 1fr;gap:6px;align-items:baseline;line-height:1.55;font-size:12px;color:#3e584a}.rubric-items .rk{font:650 10px var(--sans);color:#24795b;background:#e8f4ec;border-radius:4px;text-align:center;padding:1px 0}
.help-message .help-h{font-size:12px;font-weight:650;color:#2d4c3c;margin:14px 0 4px}.help-message .rubric-items li{font-size:13px}
.stage-summary{margin:0;font-size:12px;color:#4d6a58;font-weight:600}
.problem-tile small .stars{gap:1px}.problem-tile small .star{width:12px;height:12px}.problem-tile.full{background:#f4faf6;border-color:#cfe5d7}.problem-tile small.legacy{color:#2f6f53;font-weight:600}.legacy-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:#7aa58b;margin-left:4px}
.completion-score{display:flex;justify-content:center;align-items:center;gap:8px;margin:-6px 0 14px;font:650 13px var(--sans);color:#2c5a43}.completion-score .star{width:22px;height:22px}
.completion-criteria{list-style:none;padding:12px 14px;margin:0 0 22px;text-align:left;background:#f7faf8;border:1px solid #e6eee8;border-radius:12px;display:grid;gap:7px}.completion-criteria li{display:grid;grid-template-columns:16px 1fr;gap:8px;align-items:start;font-size:12px;line-height:1.6;color:#3f5a4b}.completion-criteria svg{width:16px;height:16px;margin-top:2px}.completion-criteria li.ok svg{color:#24795b}.completion-criteria li.no{color:#6a5048}.completion-criteria li.no svg{color:#ab4a32}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
#completion-dialog{width:480px}.completion-message{margin-bottom:16px}
#completion-dialog.partial .completion-mark{background:#f3f6f4;color:#3c6a52}
.completion-mark.fail{background:#fbefeb;color:#ab4a32;width:56px;height:56px;margin:0 auto 14px;border-radius:50%;display:grid;place-items:center}.completion-mark.fail svg{width:30px;height:30px}
.fail-card{text-align:center}.fail-card .failure-message{margin:0}.fail-card .notice-confirm{margin:24px auto 0;display:inline-flex;align-items:center;gap:6px}.notice-confirm svg,.completion-actions svg{width:15px;height:15px;vertical-align:-2px;margin-right:4px}
#failure-dialog{width:420px}
@media(max-width:760px){.rubric>summary{width:auto}.completion-criteria{padding:10px 12px}.problem-tile small .star{width:10px;height:10px}}