*,:before,:after{box-sizing:border-box}body{color:#111;background:#f9f9f9;margin:0}#root{min-height:100vh}*{box-sizing:border-box;margin:0;padding:0}body{color:#111;background:#f9f9f9;font-family:Arial,Helvetica,sans-serif}.app{max-width:700px;margin:60px auto;padding:0 20px}h1{margin-bottom:4px;font-size:1.3rem}.subtitle{color:#666;margin-bottom:32px;font-size:.85rem}.tabs{gap:8px;margin-bottom:24px;display:flex}.tabs button{cursor:pointer;background:#fff;border:1px solid #ccc;padding:6px 16px;font-family:Arial,Helvetica,sans-serif;font-size:.9rem}.tabs button.active{color:#fff;background:#111;border-color:#111}.section{flex-direction:column;gap:12px;display:flex}label{color:#444;margin-bottom:4px;font-size:.85rem;display:block}input,select{background:#fff;border:1px solid #ccc;width:100%;padding:6px 8px;font-family:Arial,Helvetica,sans-serif;font-size:.9rem}button.primary{color:#fff;cursor:pointer;background:#111;border:none;align-self:flex-start;padding:8px 20px;font-family:Arial,Helvetica,sans-serif;font-size:.9rem}button.primary:hover{background:#333}.output{border-top:1px solid #ddd;margin-top:24px;padding-top:16px}.output h2{color:#444;text-transform:uppercase;letter-spacing:.05em;margin-bottom:12px;font-size:.9rem}.step{border-bottom:1px solid #eee;padding:8px 0;font-size:.85rem;line-height:1.6}.instruction-row{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.inst-num{color:#888;flex-shrink:0;width:24px;font-size:.8rem}.instruction-row input,.instruction-row select{flex:1;width:auto;min-width:60px}.remove-btn{cursor:pointer;color:#999;background:0 0;border:1px solid #ccc;flex-shrink:0;padding:4px 8px;font-size:.75rem}.remove-btn:hover{color:#333;border-color:#999}.result{color:#eee;word-break:break-all;background:#111;margin-top:16px;padding:12px;font-size:.9rem}.footer{color:#999;text-align:right;font-size:.75rem;line-height:1.5;position:fixed;bottom:16px;right:20px}
