.heu-tool{background: var(--bs-body-bg,#fff);border-radius: 12px;border: 1px solid var(--bs-border-color,#dee2e6);overflow: hidden;box-shadow: 0 1px 3px rgba(0,0,0,.06);margin-bottom:2rem;}
.heu-mode-bar{display: flex;gap: 0;padding: 0 12px;background: var(--bs-tertiary-bg,#f8f9fa);border-bottom: 1px solid var(--bs-border-color,#dee2e6);}
.heu-mode-btn{flex: 1;max-width: 160px;padding: 12px 16px;font-size: 15px;font-weight: 500;color: var(--text-muted);background: transparent;border: none;border-bottom: 3px solid transparent;cursor: pointer;transition: color .2s,border-color .2s;}
.heu-mode-btn:hover{color: var(--bs-body-color);}
.heu-mode-btn.heu-mode-active{color: var(--bs-primary);border-bottom-color: var(--bs-primary);}
.heu-panels{display: flex;flex-direction: column;gap: 16px;padding: 20px;}
.heu-panel{display: flex;flex-direction: column;gap: 8px;}
.heu-label{font-size: 13px;font-weight: 600;color: var(--text-muted);text-transform: uppercase;letter-spacing: .04em;}
.heu-textarea{width: 100%;min-height: 140px;padding: 14px 16px;font-family: ui-monospace,monospace;font-size: 14px;line-height: 1.5;color: var(--bs-body-color);background: var(--bs-body-bg,#fff);border: 1px solid var(--bs-border-color,#dee2e6);border-radius: 8px;resize: vertical;transition: border-color .2s,box-shadow .2s;}
.heu-textarea:focus{outline: 0;border-color: var(--bs-primary);box-shadow: 0 0 0 3px rgba(var(--bs-primary-rgb),.15);}
.heu-textarea::placeholder{color: var(--text-muted);opacity: .8;}
.heu-textarea[readonly]{background: var(--bs-tertiary-bg,#f8f9fa);cursor: default;}
.heu-actions{display: flex;flex-wrap: wrap;gap: 10px;}
.heu-btn{padding: 10px 18px;font-size: 14px;font-weight: 500;border-radius: 8px;border: 1px solid transparent;cursor: pointer;transition: background .2s,color .2s,border-color .2s;}
.heu-btn-primary{color: #fff;background: var(--bs-primary);border-color: var(--bs-primary);}
.heu-btn-primary:hover{filter: brightness(1.05);}
.heu-btn-secondary{color: var(--bs-body-color);background: var(--bs-tertiary-bg,#f8f9fa);border-color: var(--bs-border-color,#dee2e6);}
.heu-btn-secondary:hover{background: var(--bs-secondary-bg);}
.heu-btn:disabled{opacity: .6;cursor: not-allowed;}
.heu-stats{display: flex;flex-wrap: wrap;gap: 12px;margin-top: 8px;font-size: 13px;color: var(--text-muted);}
.heu-ref{margin-top: 24px;padding: 20px;border-top: 1px solid var(--bs-border-color,#dee2e6);background: var(--bs-tertiary-bg,#f8f9fa);}
.heu-ref-title{font-size: 18px;font-weight: 600;margin: 0 0 12px 0;}
.heu-ref-scroll{overflow-x: auto;-webkit-overflow-scrolling: touch;}
.heu-ref-table{width: 100%;min-width: 320px;border-collapse: collapse;font-size: 14px;}
.heu-ref-table th,.heu-ref-table td{padding: 10px 12px;text-align: left;border-bottom: 1px solid var(--bs-border-color,#dee2e6);}
.heu-ref-table th{font-weight: 600;color: var(--text-muted);background: var(--bs-body-bg,#fff);}
.heu-ref-table code{font-size: 12px;padding: 2px 6px;background: var(--bs-body-bg,#fff);border-radius: 4px;border: 1px solid var(--bs-border-color,#dee2e6);}
@media (min-width:768px){.heu-panels{flex-direction: row;flex-wrap: wrap;align-items: flex-start;}.heu-panel{flex: 1;min-width: 240px;}.heu-actions{width: 100%;order: 2;}.heu-output-panel{order: 3;}}
@media (min-width:992px){.heu-panels{gap: 24px;padding: 24px;}.heu-mode-bar{padding: 0 24px;}.heu-mode-btn{padding: 14px 20px;font-size: 16px;}}