.concept-demo{padding:24px;border:1px solid #bfd3ef;border-radius:14px;background:#f4f8ff;margin:26px 0}.concept-demo h3{margin-top:0}.concept-demo label{display:block;font-weight:650;margin-bottom:8px}.concept-demo select,.concept-demo input{font:inherit;max-width:100%;padding:10px 12px;border:1px solid #aebed6;background:white;border-radius:6px}.concept-demo input{width:130px;display:block;margin-top:6px}.concept-demo select{display:block}.demo-fields{display:flex;gap:18px;flex-wrap:wrap;align-items:start}.demo-output{font:600 18px/1.75 Consolas,monospace;background:#102443;color:#eaf1fc;border-radius:8px;padding:20px;white-space:pre;overflow-x:auto;margin:18px 0}.demo-result{font-weight:650;color:#164b93;font-size:18px}.value-pair{display:flex;gap:20px;margin-top:20px}.value-pair span{flex:1;background:white;border:1px solid #d7e2ef;border-radius:8px;padding:16px}.value-pair strong{display:block;font-size:36px;color:#2563eb}.branch-list{list-style:none;padding:0!important}.branch-list li{padding:12px 16px;border-left:3px solid #c3d0e4;background:white;margin:6px 0!important;border-radius:0 6px 6px 0}.branch-list li.active{border-color:#2563eb;background:#e1edff;font-weight:700;color:#17448a}.trace-history{max-height:280px;overflow:auto;background:white;border-radius:8px;padding:16px 16px 16px 38px}.trace-history:empty{display:none}#expression-steps li{margin-bottom:12px}#pattern-output{min-height:85px}.concept-demo button:disabled{opacity:.6;cursor:default}@media(max-width:700px){.concept-demo{padding:18px}.value-pair{gap:10px}.value-pair span{font-size:14px;padding:12px}.demo-fields{gap:12px}.demo-output{font-size:15px;padding:14px}}