.course-task-guide { box-sizing: border-box; position: relative; z-index: 20; flex: 0 0 auto; width: 100%; min-width: 0; padding: 14px 20px; border: 1px solid #0ba5cf; border-left: 3px solid #0ba5cf; background: #060c13; color: #fff3d1; font: 14px/1.45 Arial, Helvetica, sans-serif; text-align: left; overflow-wrap: anywhere; }
.course-task-guide * { box-sizing: border-box; min-width: 0; }
.course-task-guide__heading { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; }
.course-geo-task-host .course-task-guide__heading { position: sticky; top: -10px; z-index: 2; padding: 6px 0; background: #060c13; }
.course-task-guide__heading strong { flex: 1 1 240px; font-size: 16px; }
.course-task-guide__label { font-size: 10px; letter-spacing: .1em; color: #0ba5cf; }
.course-task-guide__back { display: inline-flex; align-items: center; min-height: 38px; padding: 6px 12px; border: 1px solid #0ba5cf; background: #111c28; color: #fff3d1; text-decoration: none; font-weight: 700; }
.course-task-guide__back:hover, .course-task-guide__back:focus-visible { background: #183546; outline: 2px solid #ffae00; outline-offset: 2px; }
.course-task-guide__title { font-size: 17px; font-weight: 700; margin: 8px 0 4px; }
.course-task-guide__audience { margin: 2px 0 4px; color: #d9caaa; font-size: 12px; }
.course-task-guide__audience:empty { display: none; }
.course-task-guide__steps { display: flex; flex-wrap: wrap; gap: 4px 30px; margin: 4px 0 6px; padding-left: 20px; list-style: decimal; }
.course-task-guide__detail { margin: 4px 0; color: #d9caaa; font-size: 12px; }
.course-task-guide__status { margin: 4px 0 0; color: #ffae00; }
.course-task-guide__status:empty { display: none; }
.course-task-guide__notes { margin-top: 6px; max-width: 760px; padding: 0; background: none; border: 0; }
.course-task-guide__notes summary { cursor: pointer; padding: 4px 0; color: #0ba5cf; font-size: 12px; }
.course-task-guide__notes label { display: grid; gap: 4px; padding-top: 6px; color: #fff3d1; }
.course-task-guide textarea { width: 100%; background: #02060b; color: #fff3d1; border: 1px solid #637489; padding: 8px; border-radius: 0; font: inherit; resize: vertical; }
@media (max-width: 600px) { .course-task-guide { padding: 10px 12px; } .course-task-guide__heading { gap: 4px 8px; } .course-task-guide__heading strong { flex-basis: 100%; order: 2; } .course-task-guide__back { margin-left: auto; font-size: 12px; } .course-task-guide__steps { display: block; } }