.ctr { max-width: 1000px; margin: 0 auto; padding: 28px 20px 80px; }
.back-link { font: 600 14px Inter, sans-serif; color: #4a6fff; text-decoration: none; }
.ctr__hero { text-align: center; padding: 18px 0 14px; }
.ctr__h1 { font: 800 30px/1.15 Inter, sans-serif; color: #16224a; margin: 0 0 10px; }
.ctr__sub { font: 400 16px/1.5 Inter, sans-serif; color: #5b6786; max-width: 660px; margin: 0 auto 22px; }
.ctr__form { max-width: 680px; margin: 0 auto; display: flex; flex-direction: column; gap: 10px; }
.ctr__input { width: 100%; min-height: 90px; padding: 14px 16px; font: 500 15px JetBrains Mono, monospace; border: 2px solid #d3dcf0; border-radius: 12px; outline: none; resize: vertical; box-sizing: border-box; }
.ctr__input:focus { border-color: #4a6fff; }
.ctr__btn { align-self: center; padding: 14px 26px; font: 700 15px Inter, sans-serif; color: #fff; cursor: pointer; background: linear-gradient(135deg, #4a6fff, #6a3cff); border: 0; border-radius: 12px; }
.ctr__btn:disabled { opacity: .55; }
.ctr__btn.secondary { background: #eef2fb; color: #4a6fff; }
.ctr__btns { display: flex; gap: 10px; justify-content: center; }
.ctr__status code { font: 600 13px "JetBrains Mono", monospace; background: #f1f1f8; padding: 3px 8px; border-radius: 6px; }
.ctr__status { margin-top: 14px; text-align: center; font: 500 14px JetBrains Mono, monospace; color: #6a3cff; min-height: 20px; }

.recipe__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 16px 0 6px; }
.recipe__head h2 { font: 800 20px Inter, sans-serif; color: #16224a; margin: 0; }
.recipe__summary { font: 400 15px Inter, sans-serif; color: #5b6786; margin: 0 0 16px; }
.grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 640px){ .grid { grid-template-columns: 1fr; } }
.card { border: 1px solid #e1e7f5; border-radius: 14px; background: #fff; }
.card__h { padding: 12px 16px; font: 700 14px Inter, sans-serif; color: #16224a; border-bottom: 1px solid #eef2fb; }
.card__b { padding: 12px 16px; font: 500 13px JetBrains Mono, monospace; color: #2a3a66; display: flex; flex-direction: column; gap: 6px; }
.li { display: flex; gap: 8px; }
.li b { color: #16224a; }
.li span { color: #8a96b4; }
.empty { color: #a6abc8; font-family: Inter, sans-serif; }

.check { margin-top: 18px; padding: 14px 16px; border-radius: 14px; background: #f5f8ff; }
.chk { display: flex; align-items: center; gap: 8px; font: 500 13px JetBrains Mono, monospace; padding: 3px 0; }
.chk--ok { color: #1f8f63; } .chk--no { color: #c0432f; }
.ready { margin-top: 10px; padding: 10px 14px; border-radius: 10px; font: 700 14px Inter, sans-serif; text-align: center; }
.ready--yes { background: #e4f7ef; color: #1f8f63; } .ready--no { background: #fdeae5; color: #c0432f; }

.ctr__saved { margin-top: 30px; }
.ctr__saved h3 { font: 700 16px Inter, sans-serif; color: #16224a; }
.saved__list { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.saved__item { border: 1px solid #e1e7f5; border-radius: 12px; background: #fff; padding: 12px 16px; cursor: pointer; }
.saved__item:hover { border-color: #4a6fff; }
.saved__item b { font: 600 14px JetBrains Mono, monospace; color: #16224a; }
.saved__item span { display: block; font: 400 13px Inter, sans-serif; color: #8a96b4; margin-top: 3px; }
.btn.small { padding: 9px 16px; font: 600 13px Inter, sans-serif; border-radius: 10px; border: 0; cursor: pointer; background: #4a6fff; color: #fff; }
.btn.small.secondary { background: #eef2fb; color: #4a6fff; }

/* ---- редактор ---- */
.ed-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; margin: 6px 0 22px; }
@media (max-width: 640px){ .ed-meta { grid-template-columns: 1fr; } }
.ed-l { display: flex; flex-direction: column; gap: 5px; font: 600 12px Inter, sans-serif; color: #5b6786; }
.ed-l--wide { grid-column: 1 / -1; }
.ed-in { padding: 10px 12px; font: 500 14px JetBrains Mono, monospace; color: #1e2a52; border: 1.5px solid #d3dcf0; border-radius: 9px; outline: none; box-sizing: border-box; width: 100%; }
.ed-in:focus { border-color: #4a6fff; }
.ed-dbs__h { display: flex; align-items: center; gap: 10px; font: 600 12px Inter, sans-serif; color: #5b6786; margin-bottom: 7px; }
.db-row { display: grid; grid-template-columns: 1fr 1fr auto; gap: 8px; margin-bottom: 7px; }

.mini { width: 30px; height: 30px; border: 1.5px solid #d3dcf0; background: #fff; color: #5b6786; border-radius: 8px; cursor: pointer; font: 600 13px Inter, sans-serif; }
.mini:hover { border-color: #4a6fff; color: #4a6fff; }
.mini--del:hover, .mini--del { color: #c0432f; }
.mini--del:hover { border-color: #c0432f; }
.mini--add { width: auto; height: auto; padding: 4px 10px; color: #4a6fff; border-color: #cdd8f3; }

.ed-blocks { display: flex; flex-direction: column; }
.ins { display: flex; align-items: center; gap: 8px; padding: 2px 0; }
.ins__line { flex: 1; height: 1px; background: #e4e9f6; }
.ins__btn { padding: 4px 12px; font: 600 12px Inter, sans-serif; color: #4a6fff; background: #eef2fb; border: 0; border-radius: 20px; cursor: pointer; opacity: .55; transition: opacity .15s; }
.ins:hover .ins__btn { opacity: 1; }
.ins__btn:hover { background: #4a6fff; color: #fff; }
.ins__btn--sh { color: #6a3cff; background: #efeafb; }
.ins__btn--sh:hover { background: #6a3cff; color: #fff; }

.blk { border: 1.5px solid #e1e7f5; border-radius: 13px; background: #fff; overflow: hidden; }
.blk--shell { border-left: 3px solid #6a3cff; }
.blk--file { border-left: 3px solid #4a6fff; }
.blk__top { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-bottom: 1px solid #eef2fb; }
.blk__badge { font: 700 11px Inter, sans-serif; text-transform: uppercase; letter-spacing: .04em; color: #4a6fff; background: #eef2fb; padding: 4px 9px; border-radius: 6px; }
.blk__badge--sh { color: #6a3cff; background: #efeafb; }
.blk__num { font: 500 12px Inter, sans-serif; color: #8a96b4; }
.blk__path { flex: 1; padding: 7px 10px; font: 500 13px JetBrains Mono, monospace; color: #1e2a52; border: 1.5px solid #d3dcf0; border-radius: 8px; outline: none; }
.blk__path:focus { border-color: #4a6fff; }
.blk__ops { display: flex; gap: 5px; margin-left: auto; }
.blk__code { width: 100%; min-height: 120px; padding: 12px 14px; font: 500 13px/1.55 JetBrains Mono, monospace; color: #1e2a52; background: #f7f9fe; border: 0; outline: none; resize: vertical; box-sizing: border-box; display: block; }
.blk__code--sh { min-height: 54px; background: #f6f3fe; }
.blk__code:focus { background: #fff; box-shadow: inset 0 0 0 2px #d3dcf0; }