.sequence-viewer{display:flex;flex-direction:column;height:100%;min-height:0;font-size:.875rem}.sequence-header{padding:1rem;border-bottom:1px solid #e2e8f0;background:#fff;display:flex;justify-content:space-between;align-items:center;flex-shrink:0}.sequence-content{flex:1;overflow-y:auto;padding:1rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.75rem;line-height:1.2;min-height:0;scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.2) transparent;&::-webkit-scrollbar{width:8px}&::-webkit-scrollbar-track{background:transparent}&::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.2);border-radius:4px;border:2px solid transparent;background-clip:padding-box}&:hover::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.3)}}.residue-block{display:inline-flex;margin-right:.75rem;margin-bottom:.5rem;border-radius:.25rem;background-color:#f8fafc;padding:.25rem}.residue-wrapper{display:inline-flex;align-items:center;position:relative}.residue{padding:.125rem .25rem;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.residue.selected{background-color:#3b82f6;color:#fff}.residue-marker{position:absolute;top:-.7rem;right:.4;font-size:.625rem;color:#64748b;line-height:1;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.clear-button{padding:.25rem .5rem;font-size:.75rem;border-radius:.25rem;background-color:#f1f5f9;color:#64748b;hover:bg-gray-200}