/* OFC-PANDINHA-BOXES-002 · minimalista, caixas sequenciais, tema claro/noturno */
.top-actions{display:flex;align-items:center;gap:12px}
#theme-toggle{border:1px solid #687368;border-radius:100px;padding:7px 12px;background:#222824;font-size:.72rem;white-space:nowrap;color:#e9eedf}
#theme-toggle:hover{border-color:var(--lime)}
#workbench .writer-ingredient,#workbench .writer-step{border-width:1px;background:#1c201d}
#workbench .writer-step{border-left:3px solid var(--stage-color)}
#workbench .box-container{--stage-color:#c7a8f5}
#workbench .box-action{--stage-color:#efb262}
#workbench .box-transfer{--stage-color:#88c9e8}
#workbench .box-finish{--stage-color:#a9d68c}
#workbench .writer-step .number-label{color:var(--stage-color)}
#workbench .writer-step .step-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
#workbench .writer-step .step-fields .kind-field,#workbench .writer-step .step-fields .title-field,
#workbench .writer-step .step-fields .detail-field{grid-column:1/-1}
#workbench .writer-step .step-fields label{min-width:0}
#workbench .writer-ingredient .ingredient-fields{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
#workbench .writer-ingredient .ingredient-fields .name-field{grid-column:span 2}
#workbench .writer-ingredient .ingredient-fields .note-field{grid-column:span 2}
#workbench .writer-ingredient .optional-field{display:flex;align-items:center;gap:8px;padding-top:20px}
#workbench .writer-ingredient .optional-field input{width:18px;height:18px}
#workbench .ingredient-picker{display:flex;flex-wrap:wrap;align-items:center;gap:7px;border-top:1px solid #39433b;padding-top:10px;margin-top:12px}
#workbench .picker-label{display:block;width:100%;font-size:.7rem;font-weight:800;color:var(--lime);text-transform:uppercase;letter-spacing:.07em}
#workbench .ingredient-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid #525b51;border-radius:9px;background:#252b26;font-size:.75rem;font-weight:650;white-space:normal;text-align:left}
#workbench .ingredient-chip svg{width:19px;height:19px;flex:none}
#workbench .ingredient-chip.selected{color:#142009;background:#bbf47f;border-color:#bbf47f}
#workbench .ingredient-chip.selected svg{color:#142009}
#workbench .micro-preview{background:#131814;padding:8px 10px;border-radius:8px;display:flex;align-items:center}
#workbench .micro-preview svg{flex:none}
#workbench .preview-body{display:flex;flex-direction:column;gap:12px}
#workbench .preview-header{display:grid;gap:6px}
#workbench .preview-title{margin:0;font-size:1.5rem;line-height:1.18}
#workbench .box-legend{display:flex;flex-wrap:wrap;gap:6px}
#workbench .box-legend span{border-radius:6px;border:1px solid currentColor;padding:3px 7px;font-size:.64rem;font-weight:700}
#workbench .legend-container{color:#c7a8f5}
#workbench .legend-action{color:#efb262}
#workbench .legend-transfer{color:#88c9e8}
#workbench .legend-finish{color:#a9d68c}
#workbench .writer-ingredients-overview{border:1px solid #3e4d3b;border-radius:10px;padding:11px;background:#121813}
#workbench .writer-ingredients-overview .preview-subtitle{margin:0 0 5px}
#workbench .writer-sequence{display:grid;gap:9px;min-width:0}
#workbench .writer-sequence .preview-subtitle{margin:0}
#workbench .writer-box{--stage-color:#d6baed;border:1px solid #4a5549;border-left:4px solid var(--stage-color);border-radius:11px;padding:11px;background:#1a201c;min-width:0}
#workbench .writer-box.box-container{--stage-color:#c7a8f5}
#workbench .writer-box.box-action{--stage-color:#efb262}
#workbench .writer-box.box-transfer{--stage-color:#88c9e8}
#workbench .writer-box.box-finish{--stage-color:#a9d68c}
#workbench .writer-box-head{display:flex;align-items:center;gap:10px}
#workbench .writer-box-num{display:grid;place-items:center;background:var(--stage-color);color:#121312;border-radius:7px;min-width:30px;height:30px;font-weight:900;font-size:.82rem}
#workbench .writer-box-head>svg{width:35px;height:35px;flex:none;color:var(--stage-color)}
#workbench .writer-box-main{display:grid;gap:2px;min-width:0}
#workbench .writer-box-type{font-weight:700;font-size:.62rem;line-height:1.2;color:var(--stage-color);letter-spacing:.04em;text-transform:uppercase}
#workbench .writer-box-main strong{font-size:.89rem;line-height:1.2;overflow-wrap:anywhere}
#workbench .box-path{margin:8px 0 0 40px;border:1px solid #59535f;border-radius:7px;padding:6px 8px;width:fit-content;color:#e7e5ed;font-size:.76rem}
#workbench .box-duration{display:inline-flex;margin:8px 0 0 40px;border-radius:6px;background:#45311e;color:#ffd8a0;padding:3px 7px;font-size:.72rem}
#workbench .writer-box-items{display:flex;flex-wrap:wrap;gap:6px;margin-top:11px}
#workbench .writer-item{display:inline-flex;align-items:center;gap:6px;border:1px solid #526a46;border-radius:8px;background:#1f2c1f;color:#e0e9da;padding:5px 8px;font-size:.7rem;line-height:1.25}
#workbench .writer-item svg{width:21px;height:21px;flex:none;color:#b4e891}
#workbench .writer-box-detail{margin:8px 0 0;color:#b9c3b4;font-size:.74rem;line-height:1.38}
@media(max-width:1280px){
 #workbench .preview-body{display:flex;flex-direction:column}
}
@media(max-width:740px){
 .top-actions{gap:7px}
 #theme-toggle{padding:5px 7px}
 #workbench .writer-ingredient .ingredient-fields{grid-template-columns:repeat(2,minmax(0,1fr))}
 #workbench .writer-ingredient .ingredient-fields .name-field{grid-column:1/-1}
 #workbench .writer-ingredient .ingredient-fields .note-field{grid-column:1/-1}
 #workbench .ingredient-picker{gap:5px}
 #workbench .ingredient-chip{font-size:.7rem;padding:6px 7px}
 #workbench .writer-box{padding:10px}
}
body[data-theme=light]{
 color-scheme:light;
 --bg:#f5f4ef;--panel:#ffffff;--field:#ffffff;--paper:#18211d;
 --muted:#526057;--lime:#487b20;--red:#c6383d;--gold:#76562e;--soft:#e8ece6;
 background:#f5f4ef;color:#172019;
}
body[data-theme=light] .topbar{background:#ffffff;border-color:#d7ddd4}
body[data-theme=light] .backlink,body[data-theme=light] .top-right{color:#142017}
body[data-theme=light] #theme-toggle{color:#22362a;background:#f0f2ed;border-color:#cbd8c9}
body[data-theme=light] .hero{background:#eef4eb;border-color:#c6d4bd}
body[data-theme=light] .hero h1,body[data-theme=light] .hero p:last-child{color:#203323}
body[data-theme=light] .hero h1 em{color:#3b751d}
body[data-theme=light] .panel,body[data-theme=light] .gate{background:#fff;color:#172019;border-color:#d5dbd1;box-shadow:none}
body[data-theme=light] .gate p,body[data-theme=light] .gate small,body[data-theme=light] .hint,body[data-theme=light] .guide,body[data-theme=light] .feedback{color:#506053}
body[data-theme=light] input,body[data-theme=light] select,body[data-theme=light] textarea{background:#fbfcfa;color:#152319;border-color:#becab8}
body[data-theme=light] label{color:#324b35}
body[data-theme=light] button:not(.primary),body[data-theme=light] .soft{background:#e9eee7;color:#19301e;border-color:#c1cfbd}
body[data-theme=light] .primary{background:#4c7f27;border-color:#4c7f27;color:white}
body[data-theme=light] .eyebrow.green,body[data-theme=light] .number-label{color:#467e23}
body[data-theme=light] .tag,body[data-theme=light] .step-index{background:#edf2ea;border-color:#c3d1bc;color:#3d602b}
body[data-theme=light] #workbench .writer-ingredient,
body[data-theme=light] #workbench .writer-step{background:#fafcf9;border-color:#d1dbca;border-left-color:var(--stage-color)}
body[data-theme=light] #workbench .ingredient-picker,body[data-theme=light] .section-space{border-color:#d0dccb}
body[data-theme=light] #workbench .picker-label{color:#3f7521}
body[data-theme=light] #workbench .ingredient-chip{background:#e8f0e5;color:#17301a;border-color:#becebb}
body[data-theme=light] #workbench .ingredient-chip.selected{background:#4b7b29;color:#fff;border-color:#4b7b29}
body[data-theme=light] #workbench .ingredient-chip.selected svg{color:#fff}
body[data-theme=light] #workbench .micro-preview{background:#edf3e9;color:#245f28}
body[data-theme=light] #workbench .writer-ingredients-overview{background:#f5faf1;border-color:#d1decb}
body[data-theme=light] #workbench .writer-box{background:#fff;border-color:#d2dcd0;border-left-color:var(--stage-color);color:#172519}
body[data-theme=light] #workbench .writer-box.box-container{--stage-color:#7247a1}
body[data-theme=light] #workbench .writer-box.box-action{--stage-color:#a16b27}
body[data-theme=light] #workbench .writer-box.box-transfer{--stage-color:#266d94}
body[data-theme=light] #workbench .writer-box.box-finish{--stage-color:#48852d}
body[data-theme=light] #workbench .writer-box-num{color:white}
body[data-theme=light] #workbench .box-path{color:#3d4a3c;border-color:#cad5c6}
body[data-theme=light] #workbench .writer-item{background:#edf6e8;border-color:#c7d8c1;color:#1e3a1f}
body[data-theme=light] #workbench .writer-item svg{color:#4a822a}
body[data-theme=light] #workbench .writer-box-detail,body[data-theme=light] #workbench .p-ing small{color:#526459}
body[data-theme=light] #workbench .preview-title{color:#1b2c21}
body[data-theme=light] .preview-description{color:#657164}
body[data-theme=light] .preview-yield,body[data-theme=light] .preview-subtitle{color:#397120}
body[data-theme=light] #workbench .p-ing{border-color:#dde7d7}
body[data-theme=light] #workbench .p-ing svg{color:#477b2b}
body[data-theme=light] #workbench .recipe-list button.active{background:#daecd2;border-color:#77a65b;color:#2b651d}
body[data-theme=light] footer{color:#677468;border-color:#d5ddd0}

#workbench .demo-notice{display:inline-flex;width:max-content;max-width:100%;padding:4px 8px;border-radius:6px;background:#383023;color:#f8d69a;border:1px solid #795d35;font-weight:850;font-size:.65rem;letter-spacing:.04em}
body[data-theme=light] #workbench .demo-notice{color:#794f19;border-color:#d0b584;background:#f8eedb}
